Text Lift

A word that stays still until your cursor moves through it. Nearby letters lift, gain weight, narrow a little, then settle back onto one baseline.

Feels like

Hover/Spring

Built with

React 19Tailwind v4Motion

Steal it

npx shadcn@latest add https://1iad.com/r/text-lift

One self-contained file. Paste the prompt into your AI agent and it does the rest.

Good to know

At rest, every character shares one clean baseline.
The effect follows cursor proximity, so the word stays readable even at its most expressive.
Turn cursor response off for a still typographic lockup. Reduced-motion users see that calmer version automatically.

Credits

Built in public by Sunny JoshiMIT licensed. Free to steal.

Back

Text Lift

A word that stays still until your cursor moves through it. Nearby letters lift, gain weight, narrow a little, then settle back onto one baseline. Install: npx shadcn@latest add https://1iad.com/r/text-lift

TOUCH

move across the word

Live tuner

Text Lift

Make the word your own. The baseline stays calm; your cursor does the lifting.

Word

Up to 14 letters, numbers, or spaces.

Type scale116px

Rest weight470

Peak weight820

Rest width108%

Peak width122%

Lift18px

Focus4.4×

Tracking0.00em

Text colour

Cursor response

Text Lift010