ParticleWords renders live text as a field of glowing, physics driven particles and morphs one word into the next as visitors scroll. Each scroll step explodes the current word into particles that scatter and reform into the next, creating a cinematic, motion-forward hero moment. Scroll fast and the particles react with a burst of momentum. Everything is editable from the properties panel no code required.
What you can do:
Scroll-driven word morphing add a list of words, each with its own color, and let scroll transition one into the next with an explode-and-reform effect. Or turn scroll off for a standalone animated headline that auto-cycles.
Auto Pin Spacer the component pins itself and builds its own scroll length automatically. Just set the height to Fit Content no manual sticky setup needed.
Scroll Jolt particles react to scroll velocity with a momentum burst for a tactile, alive feel.
5 animation modes Static, Float, Wave, Pulse, and Scatter, each with adjustable speed and amplitude.
Mouse interaction Repel, Attract, Click Repel, or Click Explode, with tunable radius and force.
Auto explode & reform set it on a timer for continuous motion with no interaction needed.
Full type control font size, weight (Thin → Black), letter spacing, word spacing, alignment, and multi-line support.
Particle styling size, density, opacity, and glow intensity, from fine dust to bold neon.
Ambient background dots optional floating particles with custom count and color for depth.
Fully responsive adapts to any container size automatically.
Perfect for landing page heroes, portfolio intros, product reveals, and any section that needs a distinctive, animated statement.
Setup: Drop it in, add your words, and set the layer height to Fit Content. That's it the component handles the pinning and scroll length for you.
ParticleWords renders live text as a field of glowing, physics driven particles and morphs one word into the next as visitors scroll. Each scroll step explodes the current word into particles that scatter and reform into the next, creating a cinematic, motion-forward hero moment. Scroll fast and the particles react with a burst of momentum. Everything is editable from the properties panel no code required.
What you can do:
Scroll-driven word morphing add a list of words, each with its own color, and let scroll transition one into the next with an explode-and-reform effect. Or turn scroll off for a standalone animated headline that auto-cycles.
Auto Pin Spacer the component pins itself and builds its own scroll length automatically. Just set the height to Fit Content no manual sticky setup needed.
Scroll Jolt particles react to scroll velocity with a momentum burst for a tactile, alive feel.
5 animation modes Static, Float, Wave, Pulse, and Scatter, each with adjustable speed and amplitude.
Mouse interaction Repel, Attract, Click Repel, or Click Explode, with tunable radius and force.
Auto explode & reform set it on a timer for continuous motion with no interaction needed.
Full type control font size, weight (Thin → Black), letter spacing, word spacing, alignment, and multi-line support.
Particle styling size, density, opacity, and glow intensity, from fine dust to bold neon.
Ambient background dots optional floating particles with custom count and color for depth.
Fully responsive adapts to any container size automatically.
Perfect for landing page heroes, portfolio intros, product reveals, and any section that needs a distinctive, animated statement.
Setup: Drop it in, add your words, and set the layer height to Fit Content. That's it the component handles the pinning and scroll length for you.
Nirav Jivani
