Point at any page that uses GSAP.
Get its GSAP back.
Animation Grabber pulls the live GSAP tweens, timelines and ScrollTriggers out of a page and hands them to you, or your coding agent, as runnable code.
gsap.registerPlugin(ScrollTrigger);
const intro = gsap.timeline({ defaults: { ease: "power3.out" } });
intro.from(".hero-heading", { y: 40, opacity: 0, duration: 0.8 }, 0);
intro.from(".hero-lede", { y: 24, opacity: 0, duration: 0.6 }, 0.2);
gsap.to(".feature-card", {
y: 0, opacity: 1, stagger: 0.1,
scrollTrigger: { trigger: ".features", start: "top 80%" }
});Why your agent needs this
-
Live state, not source
Reads
gsap.globalTimelineandScrollTrigger.getAll()at runtime. Real durations, eases, positions and targets, not a guess from minified bundles. -
Runnable code
Rebuilds
gsap.to / from / fromTo / set, timelines with labels and positions, inlinescrollTriggerconfigs andScrollTrigger.createcalls. -
Three ways to grab
Chrome extension for point-and-click, a CLI for scripts and CI, and an agent skill for one-slash-command handoffs.
-
Catches intro animations
GSAP forgets finished tweens. Reload & record flips
autoRemoveChildrenbefore the first frame so load-time animations survive. -
Local only
Everything runs in your browser or on your machine. No server, no account, no data leaves your device.
-
Structured for agents
JSON with CSS selectors, serialized
vars, parent-child timeline structure and trigger links an agent can parse without ambiguity.
Chrome extension
Open, grab, paste.
Works on any page that exposes window.gsap. Needs only
activeTab; host access is requested per site, only when you record.
- Extract Click the toolbar icon on a live page. Tweens, timelines and ScrollTriggers are listed instantly.
- Reload & record Missing the intro? Record reloads the page with a recorder attached so load-time animations are kept.
- Copy Switch between Code, JSON and the page's own GSAP source snippets. Copy or download.
CLI
URL in, GSAP out.
Runs a headless Chromium with the recorder attached from the first byte, then prints code, JSON or source snippets to stdout.
View on npmnpx animation-grabber https://example.comnpm i -g animation-grabberanimation-grabber https://example.com --format json -o anim.jsonAgent skill
One slash command.
Give Claude Code (or any agent that reads SKILL.md) a URL. It grabs the
animations and rebuilds them in your project.
npx skills add shotcowboystyle/animation-grabber/animation-grabber https://example.comFAQ
How do I copy a GSAP animation from a website?
Open the page and click the Animation Grabber toolbar icon. It lists the page's live
tweens, timelines and ScrollTriggers, which you can copy as GSAP code, as JSON, or as
the page's own GSAP snippets. From a terminal, run
npx animation-grabber <url>.
Does it work on Webflow sites?
Yes. It reads Webflow's built-in GSAP interactions, and any site that loads GSAP from a script tag or a CDN. Webflow's older IX2 interaction engine isn't GSAP, so those animations can't be read.
Does it work in Firefox?
A Firefox version is waiting for review on Mozilla's add-on store. Until it's approved, use the Chrome extension or the CLI.
Why does it say window.gsap is not defined?
The site either bundles GSAP inside its own JavaScript build (Vite, webpack) or
doesn't use GSAP. A bundled copy can't be read live, but the Scripts view still lists
any GSAP calls found in the page's script files. The CLI does the same with
--format scripts.
Why are the page's intro animations missing?
GSAP discards animations once they finish, so a load-time intro is gone by the time you click. Use Reload & record: it reloads the page with a recorder attached so those animations are kept. The CLI records automatically.
Why did it find GSAP but zero animations?
The page probably creates its animations only after a hover, click or scroll. In the
extension, trigger the interaction first, then extract. In the CLI,
--wait 3000 gives the page more time, but it doesn't scroll or click for
you.
How is this different from reading the site's source?
Source is usually minified, and parts of it may be generated at runtime. Animation Grabber reads what GSAP is actually running: the final durations, eases, positions, targets and ScrollTrigger start and end points.
Can I reuse animations I grab from someone else's site?
Treat the output as a reference for learning how something was built. The motion design belongs to whoever made the site, so check their terms before shipping a copy. Animation Grabber is not affiliated with GreenSock.
Limitations
-
GSAP must be exposed as
window.gsap. A copy bundled privately into the site's code can't be read live; only its source snippets are available. - Only GSAP. CSS animations, Lottie and Webflow IX2 aren't captured.
-
Only the current screen size. Capture reflects the viewport at that
moment (the CLI uses the headless browser's default size). Breakpoint-specific
animations from
gsap.matchMediaaren't rebuilt as responsive code. - Only the top-level page. GSAP running inside iframes isn't read.
- No logins or interactions in the CLI. It opens a fresh browser with no cookies and doesn't scroll, click or sign in. Pages behind a login, or animated only on interaction, come back partial.
-
Callbacks may need rework. Functions such as
onUpdateor function-based values are copied as source text, up to 2,000 characters. Anything that relies on the original page's variables won't run as-is. - Selectors describe the source page. The generated CSS selectors match that page's markup; map them onto yours.
- Some scripts can't be read. Files the browser blocks from cross-site fetching appear in the Scripts view with an error instead of their contents.
- Very large pages are capped. Extraction stops at 2,000 animations and shows a warning.
Privacy
Animation Grabber runs entirely on your device. The extension reads the current tab only when you click Extract, asks for access to a site only when you choose Reload & record, and never sends page content, URLs or usage data anywhere. The CLI and skill do the same from your machine.