FloatingParticles

Drifting, twinkling motes — thousands of real simulated particles floating in a shared heading with per-particle wander and variance, and a cursor that stirs the field with a gust that settles back into the drift

Props

  • particleColor

    Color of the particles

    Type
    string
    Default
    #ffffff

  • shape

    What each particle is drawn as — a crisp dot or square (softness still feathers them), or a soft glow puff

    Type
    "dot" | "square" | "glow"
    Default
    dot

  • count

    Number of particles

    Type
    number
    Default
    1200

  • particleSize

    Size of the particles (each also varies slightly for depth)

    Type
    number
    Default
    1.2

  • softness

    Edge softness of each particle — 0 is a crisp shape, 1 a soft glow puff

    Type
    number
    Default
    0.1

  • speed

    Speed of the shared drift

    Type
    number
    Default
    0.25

  • angle

    Drift heading in degrees (0 = left, 90 = up, 180 = right, 270 = down — the classic default floats upward)

    Type
    number
    Default
    90

  • speedVariance

    Per-particle speed variance around the shared drift (0 = everything moves in lockstep)

    Type
    number
    Default
    0.3

  • angleVariance

    Per-particle heading variance in degrees (0 = one shared direction, 180 = every which way)

    Type
    number
    Default
    30

  • randomness

    Orbital wander — each particle circles lazily around its drift path instead of gliding straight

    Type
    number
    Default
    0.25

  • twinkle

    Intensity of the twinkle (0 = steady, 1 = full shimmer)

    Type
    number
    Default
    0.5

  • cursorStrength

    How strongly the cursor stirs the field — 0 (default) leaves the drift undisturbed

    Type
    number
    Default
    0

Usage

<Shader>
  <FloatingParticles />
</Shader>