backgrounds

ParticleField

Drifting particle background that floats upward.

npx chaos add particle-field

PREVIEW

USAGE

import { ParticleField } from '@/components/chaos/backgrounds/particle-field';

<ParticleField />
<ParticleField count={100} color="#ff0040" />
<ParticleField sizeRange={[2, 5]} opacity={0.8} />

PROPS

PropTypeDefault

countNumber of particles

number50

colorParticle color

string"#ffffff"

sizeRangeSize range in px

[number, number][1, 3]

opacityParticle opacity

number0.5

durationRangeDrift duration range

[number, number][10, 20]