Flow Field Particles

Flow Field Particles

Flow Field Particles brings thousands of generative particles to your canvas, each one flowing along its own elliptical orbital path. Move your cursor and the field responds instantly — particles are pushed away in real time, creating a tactile, immersive backdrop that feels alive.

How it works

Every particle is assigned its own lane, speed, size, and length at render time. A shared time accumulator drives all particles forward at a consistent rate, so cursor movement only displaces them — it never changes the underlying flow. When the cursor leaves, particles smoothly drift back into their natural orbits.

Key Features

- Cursor repulsion — particles are pushed away from your pointer with distance-based falloff

- Auto-morph mode — optional animated shape-shifting over time

- Gradient color support — single color or dual-color gradient across the canvas

- 17 exposed properties — count, size, length, tilt, density, speed, and more

- Responsive canvas — automatically resizes to fit any container

- Hardware accelerated — rendered on a native <canvas> element with requestAnimationFrame

Properties

- Particle count multiplier — 0.25× to 6×

- Particle size range — min / median / max in px

- Particle length range — for streaked particles

- Density contrast — from uniform to clustered

- Orbit width & height — elliptical shape control

- Tilt angle — rotation of the entire field

- Curve / bend amount — organic waviness

- Speed, auto-morph period and amount

- Color mode — single or gradient

Best for

Hero sections, ambient backgrounds, loading screens, and any place that needs subtle motion without distraction.