Founding price: $35, then $79.99 after 23:59 UTC on 4 November, then $79.99
Get ProA canvas-based pseudo-3D particle field with perspective projection, continuous rotation, buoyant drift and depth-aware rendering.
This item has no props to tune. Use the lens above to change theme, density, direction and more.
Floating3DParticles renders an absolutely positioned canvas (inset-0, pointer-events-none). Place it inside a relative container and layer any foreground content above it with z-10.
| Prop | Type | Default | Description |
|---|---|---|---|
className | string | - | Additional CSS classes for the canvas element. |
quantity | number | 400 | Number of particles on desktop viewports. Automatically scales down to 20% on mobile screens (< 768px). |
color | string | "#8B5CF6" | Particle color (supports 3-digit or 6-digit hex). |
size | number | 5 | Mean particle radius in px. Each particle varies within ±40% of this value. |
opacity | number | 0.3 | Mean particle opacity (0–1). Each particle varies within ±0.2, clamped to [0, 1]. |
drift | number | 0.8 | Vertical floating speed in px per frame. Positive drifts upward, negative downward. |
depth | number | 0.5 | 3D depth intensity (0–1). 0 = flat 2D plane; 1 = strong perspective with pronounced near/far scaling. |