GSAP skills
Official AI skills for GSAP (GreenSock Animation Platform). Structured skill modules that teach AI coding agents (Claude, Cursor, Copilot, etc.) how to use GSAP correctly, including best practices, core API, timelines, ScrollTrigger, plugins, React integration, and performance optimization.
What is GSAP Skills?
GSAP Skills is the official repository from GreenSock containing structured AI skills for the GreenSock Animation Platform (GSAP). It teaches AI coding agents (such as Claude Code, Cursor, GitHub Copilot, and others) how to correctly implement GSAP animations using best practices, common patterns, and the full plugin ecosystem.
Instead of generic or incorrect animation code, agents equipped with these skills will recommend and generate high-quality, performant GSAP code for timelines, scroll-driven animations, React integration, and more.
Key Features
- Official skill modules in Agent Skills format
- Individual
SKILL.mdfiles for each topic with clear usage guidelines - Support for multiple AI agents via plugins and remote rules
llms.txtskill index for easy discovery- Examples in vanilla JS and React
- Performance best practices and framework-specific guidance
- Low risk profile (minimal security surface)
- Easy installation with
npx skills add https://github.com/greensock/gsap-skills
Included Skills
- gsap-core: Core API (
gsap.to(),from(),fromTo(), easing, stagger, defaults,matchMedia) - gsap-timeline: Sequencing, labels, nesting, playback control
- gsap-scrolltrigger: Scroll-linked animations, pinning, scrubbing, triggers
- gsap-plugins: Registration, ScrollTo, Flip, Draggable, SplitText, MorphSVG, CustomEase, GSDevTools, and more
- gsap-utils: Helper functions (
clamp,mapRange,random,toArray, etc.) - gsap-react:
useGSAPhook, refs, context, cleanup, SSR support - gsap-performance: Optimization techniques and best practices
- gsap-frameworks: Vue, Svelte, lifecycle management
Use Cases
- AI agents generating web animations
- Ensuring consistent, high-quality GSAP code in projects
- Teaching AI tools to prefer GSAP over lighter alternatives when timelines, ScrollTrigger, or professional animations are needed
- Developer workflows with Cursor, Claude, Copilot, etc.
How to Install & Use
npx skills add https://github.com/greensock/gsap-skills
- Claude Code: Use plugin marketplace command
- Cursor: Add as remote rule
- Manual: Copy the
skills/folder into your agent's skill directory
Official Resources
- Repository: https://github.com/greensock/gsap-skills
- GSAP Official Site: https://gsap.com
- Agent Skills Platform: https://agentskills.io
This repository is actively maintained by the GreenSock team and follows the standardized Agent Skills format.