Text Animations
Lumen
Copy that lights up as you read it. Words ahead sit dim and unfocused, and stay lit once you pass them.
Install
Props
What It Demonstrates
- Scroll-driven animation
- An animation whose progress is tied directly to scroll position.
- Scroll reveal
- Elements fade or slide into place as they enter the viewport.
- Stagger
- Animate several items one after another with a small delay between each, creating a cascade.
- Interpolation / Tween
- Generating all the in-between frames between a start and end value, so motion is continuous.
- Blur
- A blur filter used to soften an element or mask tiny imperfections.
- Purposeful animation
- Motion should serve a function — orient, give feedback, show relationships — not just decorate.
Related Components
Word RevealPro
A scroll-scrubbed word reveal — each word brightens and rises as it enters the viewport, tied directly to scroll position.
Letters Pull
A per-letter pull-up reveal. Letters rise, sharpen from a blur, and fade in with a stagger.
Morphing Text
A gooey blur-morph that cross-dissolves between a list of words.
Variable Proximity
Text whose letters shift font weight as the cursor gets closer.
Scramble Text
Ciphered glyphs boiling out of noise and resolving into words. A decode cascade that settles character by character, a hover that re-scrambles on demand, or a continuous low glitch that keeps the type restless, each freshly-resolved letter flashing accent before it cools to ink.
Specter
Spectral RGB-split echoes drift off the letters and dissolve into the dark.