← GSAP crash course for absolute beginners

SplitText

Chapter 13 of 15 · 54:43

Live demoFull screen ↗
gsap.registerPlugin(SplitText);

document.fonts.ready.then(() => {
  const split = SplitText.create(".title", {
    type: "lines, words",
    mask: "lines"
  });

  gsap.from(split.lines, {
    yPercent: 100,
    duration: 0.8,
    ease: "power4.out",
    stagger: 0.1
  });
});

Loads GSAP 3.13.0, SplitText from a CDN