The GreenSock Animation Platform (GSAP) is an industry standard Javascript animation library. It allows you to choreograph breathtaking, high-performance UI animations across any browser flawlessly.
Animate ANYTHING JS can touch. CSS variables, canvas objects, SVG paths, scroll triggers, and complex overlapping timelines.
GSAP bypasses react-state bottlenecks and optimizes transforms at exactly 60fps natively, beating heavy CSS calculations.
With the GSAP ScrollTrigger plugin, hooking up jaw-dropping parallax elements or scrubbable video tied exactly to your mouse wheel is trivial.
You can hook GSAP up via CDN for quick HTML tests, or via NPM for usage inside React components.
1import { gsap } from "gsap";
2
3// Animate the element matching the ".box" class:
4gsap.to(".box", {
5 x: 200,
6 rotation: 360,
7 duration: 1.5,
8 ease: "power2.out"
9});
10
11// A sequenced Timeline:
12const tl = gsap.timeline();
13tl.from(".header", { y: -50, opacity: 0 })
14 .to(".box", { scale: 1.5 });