gsap
GSAP animation reference for HyperFrames. Covers gsap.to(), from(), fromTo(), easing, stagger, defaults, timelines (gsap.timeline(), position parameter, labels, nesting, playback), and performance (transforms, will-change, quickTo). Use when writing GSAP animations in HyperFrames compositions.
This skill ships only metadata — no inline instructions. See the source repo for details.
Install this skill
One command (all agents)
Runs the npx skills CLI which auto-detects every AI coding agent you have installed (Claude Code, Cursor, Codex, OpenCode, Windsurf, Copilot, and 51 more).
npx skills add https://github.com/heygen-com/hyperframes/tree/HEAD/skills/gsapAlternative: shorthand form
npx skills add heygen-com/hyperframes --skill gsapInstall to a specific agent
Pick the agent you use. The CLI writes the skill to that agent's standard skill directory.
npx skills add heygen-com/hyperframes --skill gsap --agent claude-codenpx skills add heygen-com/hyperframes --skill gsap --agent cursornpx skills add heygen-com/hyperframes --skill gsap --agent codexnpx skills add heygen-com/hyperframes --skill gsap --agent opencodenpx skills add heygen-com/hyperframes --skill gsap --agent github-copilotnpx skills add heygen-com/hyperframes --skill gsap --agent windsurfManual install (no CLI)
Prefer to skip the CLI? Clone the repo and drop the skill folder into your agent's skills directory.
git clone https://github.com/heygen-com/hyperframes.gitcp -r hyperframes/skills/gsap ~/.claude/skills/ For other agents, replace ~/.claude/skills/ with their skill directory — see the full list.
Use it
Once installed, ask your agent to "use the gsap skill" or describe what you want (e.g. "GSAP animation reference for HyperFrames. Covers gsap.to(), from(), fromTo(), ea"). Most agents auto-discover the skill from its SKILL.md description — no slash command needed.
npx skills. Skill files are MIT-style permissive by default — check the source repo for the actual license.
SKILL.md source
--- name: gsap description: GSAP animation reference for HyperFrames. Covers gsap.to(), from(), fromTo(), easing, stagger, defaults, timelines (gsap.timeline(), position parameter, labels, nesting, playback), and performance (tr ---
Want the ready-to-ship business bundle?
500+ agent skills, $15 one-time, lifetime access. 20 categories spanning content, marketing, sales, finance, legal, ops, SEO & more — finished deliverables, not drafts. Works with Claude Code, Codex, Cursor & every agent runtime.
Related skills 6
animate
Review a feature and enhance it with purposeful animations, micro-interactions, and motion effects that improve usability and delight. Use when the user mentions adding animation, transitions, micro-interactions, motion design, hover effects, or making the UI feel more alive.
optimize
Diagnoses and fixes UI performance across loading speed, rendering, animations, images, and bundle size. Use when the user mentions slow, laggy, janky, performance, bundle size, load time, or wants a faster, smoother experience.
colorize
Add strategic color to features that are too monochromatic or lack visual interest, making interfaces more engaging and expressive. Use when the user mentions the design looking gray, dull, lacking warmth, needing more color, or wanting a more vibrant or expressive palette.
bolder
Amplify safe or boring designs to make them more visually interesting and stimulating. Increases impact while maintaining usability. Use when the user says the design looks bland, generic, too safe, lacks personality, or wants more visual impact and character.
delight
Add moments of joy, personality, and unexpected touches that make interfaces memorable and enjoyable to use. Elevates functional to delightful. Use when the user asks to add polish, personality, animations, micro-interactions, delight, or make an interface feel fun or memorable.
distill
Strip designs to their essence by removing unnecessary complexity. Great design is simple, powerful, and clean. Use when the user asks to simplify, declutter, reduce noise, remove elements, or make a UI cleaner and more focused.