Scramble Lens

Scramble Lens turns any text into an interactive surface.

Scramble Lens turns any text into an interactive surface. Your text reads normally. When the cursor hovers over it, a soft circular lens follows the pointer — the letters inside the lens stay perfectly readable, while everything outside scrambles into random characters. The noise churns organically as you move, then settles when you stop. Move the cursor away and the text returns to normal. Fully editable in Framer: text, font, text color, scramble color, background, corner radius, padding, alignment, lens size, edge softness, churn amount, animation smoothing and the scramble character set. Built with pure code — no dependencies, fully responsive, and the layout never shifts because each letter is width-locked. Perfect for headlines, hero text, taglines and anywhere you want a tactile, eye-catching typography moment.

Hover-readable text scramble effect