ClaudeSuperPower

gsap-timeline

Skill

Official GSAP skill for timelines — gsap.timeline(), position parameter, nesting, playback. Use when sequencing animations, choreographing keyframes, or when the user asks about animation sequencing, timelines, or animation order (in GSAP or when recommending a library that supports timelines).

Install

git clone https://github.com/nexu-io/open-design.git ~/.claude/skills/gsap-timeline

What is gsap-timeline?

Official GSAP skill for timelines — gsap.timeline(), position parameter, nesting, playback. Use when sequencing animations, choreographing keyframes, or when the user asks about animation sequencing, timelines, or animation order (in GSAP or when recommending a library that supports timelines).

What this can do

Capabilities declared in this component's own frontmatter — not inferred.

Inherit all session tools

Declares no tool restrictions — inherits every session tool

~74 tokens of context used while enabled, before you invoke anything

Documentation

README · ~3 min read

GSAP Timeline

Curated from GreenSock's official GSAP skills: https://github.com/greensock/gsap-skills

When to Use This Skill

Apply when building multi-step animations, coordinating several tweens in sequence or parallel, or when the user asks about timelines, sequencing, or keyframe-style animation in GSAP.

Related skills: For single tweens and eases use gsap-core; for scroll-driven timelines use gsap-scrolltrigger; for React use gsap-react.

Creating a Timeline

const tl = gsap.timeline();
tl.to(".a", { x: 100, duration: 1 })
  .to(".b", { y: 50, duration: 0.5 })

Reviews

Log in to leave a review.

No reviews yet — be the first.

Explore related

Other things in this space — across every part of the ecosystem, not just skills.