Ripple Type Hero

Ripple Type Hero
Ripple Type Hero

About Ripple Type Hero

Your headline fills the frame as a monospace grid. Move the cursor across it and organic waves roll through the letters, dissolving them into a ramp of denser and denser characters — then the text settles back, clean and readable.

The wavefront is never a perfect circle: three layered sine wobbles give it a hand-drawn, organic edge. Fast gestures emit waves continuously along the path (no gaps), slow ones stay subtle, and every scrambled cell fades back through an afterglow you can tune — that decay is what makes the effect feel liquid instead of mechanical.

Everything is your own text: change the title and the whole grid rebuilds from it. Character ramp, wave speed, band width, afterglow — all adjustable.

DOM only, no canvas, no dependencies, nothing loaded from outside. The loop runs only while waves are alive and stops on its own. Honours prefers-reduced-motion, and shows the clean title on the Framer canvas.

From Lucas

Sand Dunes
Ripple Field
Liquid Glass Nav
Plasma Drift

Related Components

Scroll Blur by Aki
Logo Stage Pro
Progressive Blur
Scroll Zoom Reveal