Smokescreen
SmokescreenA dynamic smoke effect shader rendered over a very dark navy-black background (#040414). The composition features billowing smoke particles that transition from a light cyan-white color (#c2dbdc) at the origin points to a vibrant electric blue (#0484fc) as they dissipate and rise. The smoke effect demonstrates realistic fluid dynamics with multiple layers of semi-transparent particles creating depth and volume. The particles emit from the mouse position with a spread angle of 60 degrees and direction of 36 degrees, creating an upward-flowing motion influenced by gravity (0.5). The smoke has high detail (level 7) with visible turbulence and organic swirling patterns. The overall atmosphere is cool-toned and ethereal, with the bright blue smoke contrasting sharply against the nearly black background. The effect shows color decay as particles age, transitioning from the light cyan through to deeper blue tones. The dissipation rate (0.2) creates a gradual fade effect, and the mouse influence (0.8) allows for interactive particle manipulation. The blend mode is normal with full opacity, creating a luminous, glowing quality to the smoke particles.
Code
<script setup lang="ts">
import {
Shader,
Smoke,
SolidColor
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#040414" />
<Smoke color-a="#c2dbdc" color-b="#0484fc" :color-decay="1.4" :detail="7" :direction="36" :emit-from="{ type: 'mouse-position', originX: 0, originY: 0 }" :mouse-influence="0.8" :mouse-radius="0.07" :speed="6.2" />
</Shader>
</template>