backgrounds

GlowOrbs

Floating blurred color orbs for ambient background.

npx chaos add glow-orbs

PREVIEW

USAGE

import { GlowOrbs } from '@/components/chaos/backgrounds/glow-orbs';

<GlowOrbs />
<GlowOrbs colors={['#ff0040']} count={3} blur={100} />
<GlowOrbs sizeRange={[50, 150]} />

PROPS

PropTypeDefault

colorsOrb colors

string[]["#7c3aed", "#06b6d4", ...]

countNumber of orbs

number5

sizeRangeSize range in px

[number, number][100, 300]

blurBlur amount in px

number80

durationRangeFloat duration range

[number, number][15, 25]