GSAP Plugins skill for Claude Code: ScrollSmoother, Flip, SplitText and more

Official GSAP skill that makes Claude register and use GSAP plugins correctly, for developers adding scroll, SVG, text or drag effects.

Installs: 71.6K; on skills.sh
Stars: 17.7K; on GitHub
Updated: Jul 2026; last repo commit

When you ask about a GSAP plugin, scroll-to, Flip animations, Draggable, SVG drawing or plugin registration, Claude loads this skill. It registers the plugin with gsap.registerPlugin() and shows how to use it. It covers 20 plugins and tools, from scroll and drag to text, SVG, easing and physics.

Its SKILL.md says all plugins are free and install from the public gsap npm package. It tells Claude not to create an .npmrc with a GreenSock token or to send you to Club GSAP. It is one text file and bundles no scripts.

Good for

Developers adding Flip, Draggable or Observer interactions
Designers building scroll, text or SVG morph effects
Anyone confused by old Club GSAP install instructions

Install gsap-plugins

Claude Code

Copy this prompt.

Install the gsap-plugins skill in Claude Code. Run this command:

npx skills add https://github.com/greensock/gsap-skills --skill gsap-plugins

Then check that it loaded and tell me how to use it.

2
Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js.

From its listing on skills.sh. Source.

What's in the skill

When it loads

Official GSAP skill for GSAP plugins — registration, ScrollToPlugin, ScrollSmoother, Flip, Draggable, Inertia, Observer, SplitText, ScrambleText, SVG and physics plugins, CustomEase, EasePack, CustomWiggle, CustomBounce, GSDevTools. Use when the user asks about a GSAP plugin, scroll-to, flip animations, draggable, SVG drawing, or plugin registration.

Sections in SKILL.md

When to Use This Skill
Licensing & Install (important)
Registering Plugins
Scroll
ScrollToPlugin
ScrollSmoother
DOM / UI
Flip
Draggable
Inertia (InertiaPlugin)
Observer
Text
SplitText
ScrambleText
SVG
DrawSVG (DrawSVGPlugin)

Key facts

Author: GreenSock (GSAP)
Repository: greensock/gsap-skills
Installs on skills.sh: 71,576 (2 Nov 2026)
GitHub stars (repo): 17,689 (2 Nov 2026)
License: MIT
Last commit (repo): 29 Jul 2026
What installs: SKILL.md only (1 file); bundles no scripts
Works in: Claude Code, Cursor, Codex, OpenCode, Google Antigravity and Pi (skill folders listed in the README); 40+ more through the skills CLI
Needs: The gsap npm package, which includes every plugin (the SKILL.md gives the install command)
skills.sh audits: Gen Agent Trust Hub pass, Socket pass, Snyk pass

What it includes

All plugins ship in the public gsap package
Claude installs from the public `gsap` package and imports plugins as `gsap/SplitText`, `gsap/MorphSVGPlugin` and so on. It does not set up a private registry.
Runs code · Licensing and install
gsap.registerPlugin() before use
Claude registers each plugin once per app before it uses it.
Read · Registering plugins
ScrollToPlugin and ScrollSmoother
Claude uses these for animated scrolling and smooth-scroll pages.
Read · Scroll plugins
Flip, Draggable, Inertia and Observer
Claude uses these for layout transitions, drag interactions, momentum and scroll or touch events.
Try: “Animate this card grid reordering with GSAP Flip.”
Read · DOM and UI plugins
SplitText and ScrambleText
Claude splits text into characters, words or lines for effects, or scrambles it.
Read · Text plugins
DrawSVG, MorphSVG, MotionPath, MotionPathHelper
Claude draws strokes, morphs shapes and moves elements along a path.
Read · SVG plugins
CustomEase, EasePack, CustomWiggle, CustomBounce
Claude creates custom easing curves, wiggles and bounces.
Read · Easing plugins
Physics2D, PhysicsProps, GSDevTools, PixiPlugin
Claude uses physics-based motion, the GSDevTools timeline scrubber, and the Pixi plugin.
Read · Physics and dev tools

From the official docs

Permissions

Low risk

The skill itself is only instructions, but Claude may run an npm install command that adds the gsap package to your project. Approve that command yourself and use a project you can roll back.

What it can do

Read your data
Create and change things
Delete things
Read-only mode

Watch out for

It may add the gsap npm package to your project
The SKILL.md gives `npm install gsap` and says not to use a private registry. Read the command Claude proposes before you approve it.

Security advisories

No published security advisories as of Nov 2, 2026.

Technical details

Turning on read-only	The skill defines no read-only switch.
Talks to	npm registry downloads if Claude runs the install command
Scopes	The SKILL.md gives npm install gsap as the install step, which adds a package to your project

Questions

What does the GSAP Plugins skill do?

It makes Claude register and use GSAP plugins with the right imports and options. It covers scroll, Flip, Draggable, Inertia, Observer, text, SVG, easing and physics plugins, and the GSDevTools scrubber.

How do I install it?

Use the install box at the top of this page. The README also documents a Claude Code plugin marketplace route (/plugin marketplace add greensock/gsap-skills) and a Cursor remote rule that point at the whole repo, which holds 8 GSAP skills. Restart your agent session afterwards so it finds the new skill.

Do I need a Club GSAP membership for the plugins?

No. The skill says all plugins are free and install from the public gsap npm package. It tells Claude not to generate an .npmrc with a GreenSock token or to send you to the private registry. The README says the same, citing Webflow's acquisition of GSAP.

Do I need the other GSAP skills?

No. Its SKILL.md lists gsap-core (core tweens), gsap-scrolltrigger (ScrollTrigger) and gsap-react (React) as related skills, but it does not say it requires them. The repo has 8 skills in all (gsap-core, gsap-timeline, gsap-scrolltrigger, gsap-plugins, gsap-utils, gsap-react, gsap-performance, gsap-frameworks), and the README installs them together with one skills CLI command.

Does it work in Cursor, Codex or Copilot?

Cursor and Codex: yes, the README lists both, using the skills CLI or by copying the skills folder. GitHub Copilot is different: the README says Copilot does not load Cursor or Claude skill files, so you copy its Copilot instructions file into your repo instead. The README does not mention the Claude app.

Is it safe to install?

It is low risk. It is a single text file that tells Claude how to write GSAP code, and it bundles no scripts. The repo README rates its own risk level LOW. You still read the code Claude writes before you ship it. Its SKILL.md gives an npm install gsap command, so check what Claude wants to run in your terminal.

Information

updated Nov 2, 2026

Repository: greensock/gsap-skills
Folder: skills/gsap-plugins

greensock/gsap-skills skills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 2

gsap-plugins SKILL.md · github.com
greensock/gsap-skills README · github.com