Elastic Spring Letters
An elastic text animation: each letter rides a coil spring, tied to its neighbors by rubber bands. A finger stretches the chain and lets go, so the word whips, overshoots and wobbles back. Tactile physics for apps, games and playful brands.
Prompt · replace [TEXT]
Tool-agnosticAnimate [TEXT] as letters on springs. Set it big in a rounded geometric display face, deep plum on soft pink. Each letter sits on its own zigzag coil spring rising from a thin rail below, and neighboring letters are linked by hot-pink rubber bands that sag slightly when slack and get thinner as they stretch. A round fingertip cursor comes in, grabs a middle letter, drags it down and swings it up and across, stretching bands and coils and pulling the neighbors along, then lets go: the letter snaps back with overshoot and the whole word wobbles and settles like jelly. Later it grabs the first letter and yanks it away so a wave whips along the chain. Letters lean and squash in their direction of travel. Loop.
Visual DNA
- Letters mounted on zigzag coil springs above a rail
- Rubber bands between letters thin out when stretched and sag when slack
- Grab, drag and release with real spring overshoot and damped wobble
- Letters lean and squash along their direction of travel
- Deep plum letters and hot-pink bands on a soft pink background
- Category
- Kinetic Typography
- Demo built with
- Canvas
- Energy
- Lively
- Background
- Light bg
Also known as
No paywall, no sign-up. If a prompt saved you an hour, a coffee keeps new styles coming.
Keys: ← → browse · C copy