Text Distort hoverFX

A WebGL-powered hover effect that distorts your text through a live grid-warp shader. Move your cursor over it, and the content ripples and pulls along a smooth displacement field.

Features:

• Real-time WebGL distortion driven by cursor position and velocity

• Adjustable grid resolution, warp strength, and push/pull direction

• Separate idle and hover easing controls for fine-tuned motion feel

• Full typography controls, including font, color, outline, and fill opacity

• Auto-fit sizing (fit or fill) with min/max scale clamping, or fixed sizing

• Multi-line text support with configurable max lines

• Optional on-canvas text editing directly in the Framer preview

• Automatically falls back to a clean static version in the Canvas, thumbnails, and exports, so there's no wasted performance or visual artifacts

• Pauses rendering when off-screen or the tab is inactive, keeping it lightweight even with multiple instances on a page

Great for: hero headlines, section titles, interactive taglines, or any moment you want text to feel alive under the cursor.

Refund policy: As this is a digital product, all sales are final. No refunds are offered once purchased.