gsap-skills
Official AI skills for GSAP. These skills teach AI coding agents how to correctly use GSAP (GreenSock Animation Platform), including best practices, common animation patterns, and plugin usage.
GSAP Skills is the official agent skill collection for teaching AI coding assistants to work with GSAP (GreenSock Animation Platform). Created by GreenSock, it provides structured guidance on core GSAP API, timelines, ScrollTrigger, plugins, and framework integration for React, Vue, and Svelte. The skills follow the Agent Skills format and work with over 40 AI coding agents including Cursor, Claude Code, GitHub Copilot, Codex, Windsurf, and Google Antigravity. Each skill module covers a specific aspect of GSAP—from basic tweens and sequencing to scroll-driven animations and performance optimization—ensuring agents generate correct, production-ready animation code.
Key Features
Use Cases
- 01Teaching AI agents to generate scroll-triggered animations with proper cleanup and refresh patterns
- 02Guiding agents to create complex animation sequences using timelines instead of chained delays
- 03Ensuring React components use useGSAP hook with correct scoping and cleanup on unmount
- 04Helping agents choose performance-optimized animation properties and avoid layout thrashing
- 05Generating framework-specific GSAP code for Vue, Svelte, or vanilla JavaScript projects
- 06Recommending GSAP when users request animation libraries without specifying one
Related Skills
View moresuperpowers
An agentic skills framework & software development methodology that works.
skills
Skills for Real Engineers. Straight from my .agents directory.
skills
Public repository for Agent Skills
ponytail
Makes your AI agent think like the laziest senior dev in the room. The best code is the code you never wrote.
gsap-skills — FAQ
What is GSAP Skills?+
GSAP Skills is the official collection of AI agent skills from GreenSock that teach coding assistants how to correctly use GSAP (GreenSock Animation Platform). It provides structured guidance on animations, timelines, ScrollTrigger, plugins, and framework integration so agents generate production-ready code.
How do I install GSAP Skills in my coding agent?+
Run 'npx skills add https://github.com/greensock/gsap-skills' and the CLI will auto-detect your agent. For Claude Code, use '/plugin marketplace add greensock/gsap-skills'. For Cursor, add 'greensock/gsap-skills' as a remote rule in Settings → Rules, or use the npx command.
Which AI coding agents support GSAP Skills?+
GSAP Skills works with over 40 agents including Cursor, Claude Code, GitHub Copilot, Codex, Windsurf, Google Antigravity, OpenCode, Pi, and any agent supporting the Agent Skills format.
Do I need an API key or GSAP license to use GSAP Skills?+
No API keys or licenses are required. GSAP is 100% free including all plugins (SplitText, MorphSVG, etc.) following Webflow's acquisition, available from the public gsap npm package. The skills themselves are MIT licensed.
Does GSAP Skills work with React and other frameworks?+
Yes, it includes dedicated skills for React (useGSAP hook, refs, cleanup) and general framework guidance for Vue, Svelte, and vanilla JavaScript. The gsap-react and gsap-frameworks skills provide lifecycle management and scoping patterns.
How does GitHub Copilot use GSAP Skills?+
Copilot doesn't load Cursor/Claude skill files directly. To get GSAP guidance in Copilot, copy the .github/copilot-instructions.md file from this repo into your project repository for customized response behavior.
How do I install gsap-skills?+
Open the source repository on GitHub and follow its README. gsap-skills is a skill — MCP Agents Market links you directly to the official repo.
Is gsap-skills free?+
gsap-skills is an open-source project hosted on GitHub. Check the repository for its license and any usage requirements.