01 / The fast way
Pull a Framer Motion component library. Landing-page polish today. Good enough for marketing pages. Not the engine award winners run on.
The motion components
behind real brand sites.
Production-grade GSAP for React. Every component shipped on a real landmark site before it reached the library, so the motion you copy already survived a launch.
- React
- GSAP
- Vue
Provenance
Every component has a place it came from.
Annnimate is not a folder of demos. Every component started as a motion piece Good Fella built for a real client site, then got rewritten as a clean, documented build you can drop into your own work. You are not copying an experiment. You are copying something that already shipped.
- Coca-Cola
- BodyArmor
- WKNDHRS
- Powerade
- Good Fella
The problem
There are two ways to ship motion this good.
Neither is fast.
02 / The good way
Open an Awwwards site, rebuild what they did from scratch. Works when you have the week. You rarely do.
03 / The third option
Annnimate already built the animation - real GSAP, real React. Copy it into your project and you're done. Go enjoy your afternoon.
How it works
Find it, copy it, ship it.
Step 1
Find your favorite component
Browse the library by category or search by name. Every component runs live, so you see exactly how it behaves before you commit.
Step 2
Copy it in your format
One click copies production-ready code. React with useGSAP, Vue with the composable, or vanilla HTML if you need it. Typed, documented, reduced-motion aware.
Step 3
Ship it your way
Paste it into Next.js, Webflow, wherever modern JS runs. Adjust with data attributes or props. No wrestling with the GSAP lifecycle.
What you get
Two ways to use it.
One library of named, signature components you reach for every project. One coordinated motion system you buy once and own.
The Library
51 components / ship weeklyEvery named signature component, each one production-grade and documented. Subscribe and use the whole catalog across every project you build. New components ship regularly.
Landmark Kits
First Kit / coming soonA deep, stand-alone collection - not a single component, not part of the Library. The first Kit is Entrances: preloaders and page-enter as one system, WebGL and GSAP variants you mix. React, Vue, HTML / CSS / JS. Not for Webflow.
The standard
One component, told properly.
Magnetic Button - the simplest piece in the library - exactly the way every one of the 50 ships.
The standard
One component, told properly.
Magnetic Button - the simplest piece in the library - exactly the way every one of the 50 ships.
Built for developers who care how it moves.
Animation that moves the way it should. Real code, real refs, no bloat. Built by developers who ship.
Annnimate is for you if:
- You build in React, Vue or in code.
- You already use GSAP, or you want a reason to.
- You care about motion that feels considered, not decorative.
- You ship client work or your own projects and want a head start that does not lower the bar.
Annnimate is probably not for you if:
- You build mainly in Webflow or Framer.
- You want a large catalog of generic UI components.
- You expect a free tier - Annnimate is paid only.
- You are new to animation and want to learn the basics first. Start with the GSAP docs, they are free and excellent.
In the process of creating a digital first studio, assets like Annnimate are essential for providing that interactive edge on our products. Julian has created a tool that really helps us in the creative iteration process and saves us quite a bit of time.
Lukas HaentjensCo-founder, Three Sixty One
Annnimate makes it easier to work with animations without overcomplicating the setup. The library is broad, the tool is well built, and the animations are smooth and well crafted. I especially like the React integration, it fits naturally into how I usually build things.
Edoardo LunardiAward-winning Senior Frontend Developer
I'm a lifetime user of Annnimate. It's really good - clean documentation, code is nice and light, and the animations it gives me are world class. Similar services are 2-3 times the cost and don't offer the level of polish that Annnimate does.
Matthew StoboLifetime Member
Simple pricing.
The Library is an annual subscription. Solo at ā¬249, Studio at ā¬699 for five seats, Studio+ at ā¬1,499 for fifteen. Landmark Kits are a one-time purchase. No lifetime tiers, no per-feature add-ons, no surprises.
Switch to Yearly Pricing
Solo
ā¬/month
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
For one developer working solo or on freelance work.
- All 51 signature components
- React, Vue, HTML and Webflow
- New components as they ship
- Documentation and support
Studio
ā¬/month
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
For a small studio or team shipping client work.
- Everything in Solo
- Priority support
Studio+
ā¬/month
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
0
1
2
3
4
5
6
7
8
9
For a larger team shipping a lot of client work.
- Everything in Studio
- Priority support
Questions and answers.
Everything worth knowing before buying. Full list lives on the FAQ page.
Annnimate is a GSAP motion component library for React and Vue, built by Good Fella out of real client work. Every component shipped on a real brand site before it reached the library. You are not copying an experiment, you are copying motion that already survived a launch.
Annnimate is built on GSAP, not Framer Motion. Aceternity and Magic UI are great for Framer Motion landing-page UI. Annnimate is production code you can ship to a client on Monday, on the engine that runs award-level work ā the GSAP option for developers who notice.
Yes. Annnimate's React components are Server Component safe and work with the Next.js App Router. The Vue components are Nuxt ready. Each one uses useGSAP in React or a composable in Vue, so the GSAP context cleans up on unmount without extra plumbing from you.
Yes. Annnimate runs on GSAP, which is free for any project including every plugin. Install it with one npm install gsap. The docs walk you through the setup for React, Vue, and HTML.
Yes. Every Annnimate component respects prefers-reduced-motion and falls back to a calm, usable state. Interactive components handle keyboard focus and ARIA. The docs spell out what each one does when motion is reduced.
Yes. One Annnimate component per category is free to use in production, with no account required. It is there so you can drop real Annnimate code into your codebase before paying for anything.
Annnimate no longer offers a lifetime plan. The Library is a yearly subscription, so the catalog keeps growing and the components keep getting maintained. Developers who bought Lifetime before the 2026 relaunch keep their access. See the What's New page for the migration detail.
Annnimate ships new signature components regularly, included in any active Library subscription at no extra cost. The changelog lists every component as it lands, so you can see the cadence for yourself before you buy.
Yes. Every Annnimate tier covers unlimited commercial client projects. You and your seats can ship with the components on any work you produce. The only limit is repackaging or reselling the components as a competing library.
Annnimate Library members get 20% off every Landmark Kit purchase for as long as the subscription is active. Past Kit buyers get 20% off their first year of any Library plan. The two products are separate, but they reward each other.
Annnimate has a 30-day, no-questions-asked refund on both Library subscriptions and Landmark Kits. If it does not fit how you work, email us within 30 days of purchase and we refund you in full.
Ready to ship something that feels right?
Browse the library, copy a component, drop it into your project. The first one is free.