Scattered Grid Text

About

Turn any word into a living field of tiny squares. Move your cursor through the text and the dots scatter away, spring back with a soft glow, and ripple outward on click. A tactile, playful headline effect for main headings of the pages on your Framer site.

Features

• Full Framer Font control - any family, weight, size, tracking, line height.

• Fit-to-width auto-scaling or fixed size.

• Tunable physics: reach, push force, return speed, damping.

• Optional idle "breathe" wave when the cursor is away.

• Accent + base colors, theme-token aware (light/dark auto-adapts).

• Choose the semantic tag (H1–H4, paragraph), real text stays in the DOM for SEO and screen readers, canvas is purely decorative.

• Responsive at any layout size.

Drop it into a hero, footer, or empty state and get an interactive, accessible, performance-tuned kinetic-type effect with zero extra setup.

Note: Set the width to Fill and height to 300px (Fixed), hover and experience the magic.

Get a full guide to set up this component on your Framer site.

More components

Check our main collection page to get more components just like scattered grid text.

Support

Get in touch with us: hello@framerstacks.com