Gsap React
nexu-io/open-designAdding smooth animations to your React app is easy with GSAP. This skill shows you how to use the useGSAP hook to set up and clean up animations automatically. It works great with Next.js and other React frameworks.
You will learn to scope animations to a container using refs. This avoids problems with wrong element targets. The hook handles cleanup on unmount so you do not get memory leaks or warnings.
If you cannot use the hook, the skill also covers using gsap.context() inside a regular useEffect. Always remember to revert the context to kill old animations. This skill is your guide to reliable React animations.
Add Gsap React skill to your workflow
Global
mkdir -p ~/.claude/skills/gsap-reactProject
mkdir -p .claude/skills/gsap-reactSource Repository
More Frontend Development Claude Code Skills
Frontend Designanthropics/skills
Create striking frontend interfaces with bold design and polished code every time
Vercel React Best Practicesvercel-labs/agent-skills
Optimize React and Next.js apps using proven Vercel performance guidelines
Design Taste Frontendleonxlnx/taste-skill
Enforce premium frontend design with metric-based rules and smart component architecture
Vercel Composition Patternsvercel-labs/agent-skills
Clean React components with composition instead of boolean props
Shadcnshadcn/ui
Manage shadcn UI components easily with CLI commands and clear styling rules
Impeccablepbakaus/impeccable
Polish your frontend interfaces with expert design critique and code
Minimalist Uileonxlnx/taste-skill
Build warm minimal web interfaces with editorial typography and flat bento grids
Industrial Brutalist Uileonxlnx/taste-skill
Raw mechanical UIs fusing Swiss print with military terminal aesthetics and high data density