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.