Animation

TEXT

Source Code & Description

TEXT_03.tsxtsx

GSAP SplitText Stagger from Start

A dynamic text animation using the SplitText plugin from GSAP. This animation splits text into individual letters and reveals them with a stagger effect starting from the beginning, creating a classic left-to-right typewriter-style reveal.

Key Features

  • Letters animate sequentially from the first character
  • Creates a natural, reading-flow animation
  • Most common and intuitive stagger direction
  • Smooth easing functions for natural movement

Usage Tips

  • Adjust the stagger property to control timing: stagger: { from: "start", amount: 0.5 }
  • Modify the duration to speed up or slow down the animation
  • Perfect for most text animations and headlines