Backlit Smoke 5
Backlit SmokeA 3D isometric hexagonal shape rendered with a sophisticated multi-layer shader effect against a pure black background. The hexagon features a warm orange-to-amber gradient (#de4400 to #ff7a1f) with dynamic volumetric smoke/fire effects emanating from within and around the shape. The glass layer creates a glossy, refractive surface with subtle fresnel highlights in peachy-pink tones (#ff9b8c) along the edges, giving the shape dimensional depth and translucency. The smoke fill component generates organic, turbulent particle effects that flow upward with gravity simulation, creating a glowing ember-like atmosphere. The inner geometry shows a hollow center with visible depth, enhanced by the glass refraction properties (1.5 refraction index) and edge softness. Subtle sine wave animations add rhythmic luminous bands across the surface in bright orange (#ff7a1f). The overall mood is dramatic and energetic, with warm incandescent tones suggesting heat, fire, or molten material. The lighting angle at 300 degrees creates dimensional shading on the geometric surfaces, emphasizing the 3D structure. The effect combines rigid geometric precision with fluid, organic smoke dynamics for a striking contrast.
Code
<script setup lang="ts">
import {
Shader,
Glass,
SineWave,
SmokeFill,
SolidColor
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#0a0a0a" />
<SmokeFill color-a="#de4400" color-b="#210701" :color-decay="0.2" :detail="4" :dissipation="0.1" :emit-from="{ type: 'mouse-position', originX: 0.5, originY: 0.5 }" :gravity="-2" :scale="0.7" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/EKiSRi_0Mh6g_sdf.bin" />
<Glass :aberration="0" :cutout="true" :edge-softness="0.15" :fresnel="0.18" fresnel-color="#ff9b8c" :fresnel-softness="0.24" :refraction="1.5" :scale="0.7" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/EKiSRi_0Mh6g_sdf.bin" :thickness="0.6">
<SineWave :amplitude="0.6" color="#ff7a1f" :frequency="0.1" :softness="0.3" :speed="0.6" />
</Glass>
</Shader>
</template>