Text Animations

Type that arrives with intent — hover glitches, word staggers, character scrambles, masked line reveals and gradient sweeps.

5 demos · hover a stage to interact · press Replay to re-run

Glitch on hover

Ten displaced copies of the headline, each clipped to its own band or block and randomising on its own clock. Hover the stage to drive it.

  • clip-path
  • mix-blend-mode
  • MotionValue
  • rAF
ACCELERATING
INTERFACE
MOTION

hover to corrupt

Word stagger

Split on spaces, each word rising out of its own overflow mask.

  • variants
  • staggerChildren

Everywordarrivesabeatafterthelast,sothesentencereadsitself.

Character scramble

Glyphs cycle until each index settles, driven by one rAF loop.

  • requestAnimationFrame
  • no library

DECRYPTING SIGNAL

characters resolve left to right

Masked line reveal

Editorial-style entrance — lines slide up and un-rotate behind a mask.

  • overflow-hidden
  • rotate
  • stagger

We build the

interfaces that

other teams copy.

Gradient shine

An oversized gradient clipped to the glyphs and panned forever.

  • background-clip
  • backgroundPosition

Shimmer

One oversized gradient, clipped to the glyphs, panned on a loop.