Setup & Installation
npx skills add https://github.com/greensock/gsap-skills --skill gsap-core
https://github.com/greensock/gsap-skills/tree/main/skills/gsap-core
View on GitHubWhat This Skill Does
GSAP Core is the base animation engine for the GreenSock Animation Platform. It provides gsap.to(), gsap.from(), gsap.fromTo(), and gsap.set() for animating DOM elements, SVG, and CSS properties in any JavaScript environment. Includes easing, staggering, transform aliases, responsive control via gsap.matchMedia(), and playback methods on returned Tween instances.
CSS animations lack runtime control like pause, reverse, and seek, and become unmanageable once you need synchronized staggers, dynamic values, or responsive motion preferences — GSAP handles all of that with a consistent API across frameworks.
When to use it
- Animating a card entrance with gsap.from() and a staggered delay across a list
- Fading out a modal with autoAlpha and removing pointer events at opacity 0
- Rotating SVG elements around a shared coordinate using svgOrigin
- Disabling or shortening animations for users with prefers-reduced-motion via gsap.matchMedia()
- Controlling playback of a looping button animation with pause() and play() on a stored Tween