Text Animations
Stretch Type
ProType that deforms with how fast you are scrolling rather than how far. Each glyph springs toward the same velocity signal on a softer spring than the one before it, so the wave down the word is a consequence of the physics instead of a list of delays — change the string and it re-tunes itself.
Install
Props
What It Demonstrates
- Scroll-driven animation
- An animation whose progress is tied directly to scroll position.
- Velocity
- How fast and in which direction an element is moving. A spring carries it into the next animation when interrupted, so a flicked element keeps its speed.
- Squash & stretch
- Deforming an element as it moves to convey weight, speed, and flexibility.
- Spring
- Motion driven by physics (tension, mass, damping) rather than a set duration.
- Momentum
- Motion that carries velocity, especially after a drag or interruption.
- Skew
- Slant an element along the X or Y axis, shearing it out of its rectangular shape.
- Interruptible animation
- An animation that can be smoothly redirected mid-flight instead of finishing first.
Related Components
Marquee VelocityPro
A wrapping marquee whose drift speed and direction follow scroll velocity — fast scrolls whip the row along, upward scrolls reverse it.
KineticPro
Type with mass: every glyph is its own spring, and the squash and stretch are read back off that spring rather than authored.
Lumen
Copy that lights up as you read it. Words ahead sit dim and unfocused, and stay lit once you pass them.
Molten
Type that melts. Letters sag under their own weight, string out, and fuse into one surface where they touch, because the glyphs are a coverage field cut by a threshold rather than shapes being moved: two stems raise the coverage between them past the cut and one outline closes over both. The word underneath is a real text node the whole time, so it stays selectable, searchable, and read correctly aloud while it runs.
Word RevealPro
A scroll-scrubbed word reveal — each word brightens and rises as it enters the viewport, tied directly to scroll position.
Morphing Text
A gooey blur-morph that cross-dissolves between a list of words.