Hover Text Warp — Liquid text warps toward your cursor

What is Hover Text Warp?

Hover Text Warp is a fully interactive text component powered by liquid spring physics. Each letter independently warps, scales, and rotates toward the cursor with smooth, organic motion. A chain-reaction system spreads movement between neighbouring letters for a fluid, living feel. Perfect for hero sections, landing pages, portfolio headers, and any layout that needs a premium interactive detail.

Core Features

• Physics-based spring animation with per-letter warp, scale, rotation, and glow

• Chain-reaction propagation that spreads motion between neighbouring characters

• Proximity-based glow with pulsing highlight and optional drop shadow

• Full extended font control with family, weight, size, line height, and letter spacing

• Touch-optimised with automatic mobile detection and enlarged interaction radius

Controls inside Framer

Text

• Text content with multi-line support

Font

• Font family, weight, size, line height, and letter spacing

Colors

• Text colour

• Glow colour

Effect

• Radius — how far the warp influence reaches

• Intensity — strength of the displacement

• Smoothness — higher values produce more fluid, slower motion

• Glow — intensity of the proximity-based light effect

Appearance

• Shadow toggle

• Background colour

Best use cases

• Hero sections and above-the-fold headlines that demand attention

• Portfolio and agency landing pages showcasing creative craft

• Product launch pages where interactive polish drives conversions

• Personal sites and experimental layouts that reward cursor exploration