Smokescreen 4
SmokescreenA dynamic smoke effect shader with a dark purple background transitioning to deep black. The primary visual element is an elliptical smoke plume positioned in the upper-left quadrant, emanating from the mouse position. The smoke displays a vibrant gradient transitioning from bright lime green (#11bf31) at its core to deep purple (#5d2cb9) at its edges. The smoke particles exhibit soft, feathered edges with a glowing quality, creating a luminous halo effect. The particles appear to drift and dissipate gradually across the canvas with a slight upward bias due to gravity settings. The overall atmosphere is moody and ethereal, with the bright green-to-purple color transition creating a striking contrast against the nearly black background. The smoke has a naturalistic turbulent quality with visible detail and texture from the noise-based generation, suggesting movement and organic flow. The effect demonstrates color decay and dissipation, with particles becoming more transparent and shifting toward the purple tones as they move away from the emission point.
Code
<script setup lang="ts">
import {
Shader,
Smoke,
SolidColor
} from 'shaders/vue'
</script>
<template>
<Shader
:disable-telemetry="true"
>
<SolidColor color="#040414" />
<Smoke color-a="#11bf31" color-b="#5d2cb9" :color-decay="1.4" color-space="oklab" :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>