GSAP Animation Skill for AI Coding Tools

A comprehensive skill for creating professional animations using GSAP (GreenSock Animation Platform).

What This Skill Provides

• Complete GSAP setup and CDN configuration
• Animation methods (to, from, fromTo, set)
• Timeline sequencing and control
• ScrollTrigger scroll-based animations
• Performance best practices
• React integration patterns
• Common animation patterns and examples

How to Use

For Claude.ai Users

1. Download the SKILL.md file
2. Upload it to Claude.ai as a custom skill

For IDE Extensions (Cursor, Windsurf, etc.)

Add this to your AI configuration:

{
  "skills": [
    "https://raw.githubusercontent.com/YOUR-USERNAME/gsap-skill/main/SKILL.md"
  ]
}

For Local Development

Clone this repository and reference the skill in your AI tool's settings.

When This Skill Triggers

This skill is automatically loaded when you request:

• Animations or motion design
• Scroll effects or parallax
• Timeline sequences
• Interactive animations
• Animated components or landing pages

License

MIT License (Note: GSAP has its own license for commercial use)

Contributing

Issues and pull requests welcome! Feel free to suggest improvements or report issues.