Smokey Logo 2

A dark, atmospheric shader effect dominated by swirling smoke and particle effects in magenta and pink tones. The background is a very dark near-black color (#0d0817) creating a stark contrast. A large semi-transparent circular shape with turbulent smoke texture fills the upper portion, rendered in deep purple and magenta hues with soft, diffused edges. In the center-right area, a bright neon pink rectangular element (#ff75da) acts as a focal point, appearing to emit or interact with the surrounding smoke particles. Two additional smoke emission points create directional flow: one from the bottom-left corner emitting dark purple-to-navy smoke moving upward and rightward, and another from the bottom-right corner emitting magenta-to-dark-blue smoke moving leftward. The overall effect creates a sense of depth and movement, with the smoke dissipating and fading toward the edges. The color palette transitions from bright hot pink in the center to deep purples, dark magentas, and nearly black tones in the outer regions. The atmosphere is moody and ethereal, with a strong sense of fluid dynamics and particle interaction. Gravity and dissipation settings create a natural settling effect, while the high detail level produces fine, intricate smoke tendrils throughout the composition.

Code

vue

<script setup lang="ts">
import {
  Shader,
  Smoke,
  SmokeFill,
  SolidColor
} from 'shaders/vue'
</script>

<template>
  <Shader
    :disable-telemetry="true"
  >
    <SolidColor color="#0d0817" />
    <SmokeFill color-a="#ff75da" color-b="#ff30b0" :color-decay="3" :detail="16" :emit-from="{ type: 'mouse-position', originX: 0, originY: 0, momentum: 0, smoothing: 0 }" :emit-radius="0.05" :gravity="0" :intensity="0.95" :mouse-influence="0.35" :scale="1.1" shape-sdf-url="https://data.shaders.com/storage/v1/object/public/user-uploaded-images/user_33nh0FG48zZa0rIUZuK7vgwPfZe/5T7CT5qxxArz_sdf.bin" :speed="1.4" :spread="141" />
    <Smoke color-a="#3d1937" color-b="#0b132e" :direction="49" :dissipation="0.7" :emit-from="{ x: 0, y: 0.99 }" :emit-radius="0.13" :intensity="0.75" :speed="8.3" :spread="65" />
    <Smoke color-a="#a80a88" color-b="#0b132e" :direction="277" :dissipation="0.7" :emit-from="{ x: 1, y: 1 }" :emit-radius="0.13" :intensity="0.75" :speed="8.3" :spread="65" />
  </Shader>
</template>