Motion you copy and ship

Library80+ components

FrameworksReact, Vue, HTML/CSS/JS

PricingPro 199 EUR

Team300 EUR

CadenceOne free weekly

AnnnimateIntroduction01 / 08

GSAP motion components, built to ship

Annnimate is a library of over 80 motion components written directly against GSAP. Not Framer Motion. Each one ships TypeScript-ready, respects reduced-motion settings, and comes with a live preview next to the code you copy.

It is made by Good Fella for people doing client work on a deadline. Pro is 199 EUR, Team is 300 EUR, and a new component goes out free every week whether you buy or not.

AnnnimateLogo02 / 08

Logo

One lockup, used on Carbon or Paper. Keep it clear of code blocks and previews.

Primary on Carbon

Primary on Paper

Primary on Signal

AnnnimateColor03 / 08

Color

A dark editor palette. Signal blue marks the one thing you should click.

Carbon carries the page, Slate lifts preview cards and code blocks one step off it. Signal is reserved for the copy-code button, active tabs and framework toggles. Ash handles prop tables and captions, never body text on Carbon.

AnnnimateTypography04 / 08

Typography

Geist for headings and code-adjacent labels. Switzer for everything you read at length.

Display typeface

Geist. Tight, mechanical, built for interfaces. Used for headlines and component names.

Geist

GlyphsAaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz0123456789

Text typeface

Switzer. Open shapes, wide language support. Used for body copy, docs and pricing.

Switzer

GlyphsAaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz0123456789

Body · 17px

80+ GSAP motion components

Small body · 15px

80+ GSAP motion components

Label · 13px

80+ GSAP motion components

Caption · 12px

80+ GSAP motion components

RegularBold

In combination

Geist carries the headline, Switzer carries the paragraph. Keep body text Paper on Carbon, captions and metadata in Ash. Signal is for links and active states only, never for running text or full headlines.

80+ GSAP motion components

AnnnimateMotion05 / 08

Motion

Motion is the product. Every rule here comes from how the components actually behave.

In motion

Enter

Scaling in, opening. Content arriving into view.

Move

Reordering, shuffling. The system responding to a gesture.

In real use

Exchange

Carousel

Toggle

Reveal

The curve

Enter

Move

Every component is built on GSAP, hand-written by Good Fella. Not Framer Motion, not generated. Demo videos and marketing pages animate with the same code we ship. Every animation ships with a prefers-reduced-motion path. When a user turns motion down, transforms resolve to their end state instead of disappearing. Signal #4c6fff carries the moving part: the underline that draws, the cursor that trails, the progress bar. Carbon #0f1115 stays still behind it.

Easing is asymmetric. Fast out, slow settle. Nothing bounces past its resting position unless the component is explicitly named for that behaviour. Marketing copy about motion stays literal. Describe the duration, the easing, the trigger. Never call a component effortless or instant.

AnnnimateVoice06 / 08

Voice

We write like a developer explaining their own code: plain, specific, no pitch in the way.

Pro, 199 EUR. Team, 300 EUR. 80+ components included.

Say the number

Pro is 199 EUR. Team is 300 EUR. 80+ components. One free component every week. We state figures and let people judge them for themselves.

Built on GSAP. Not Framer Motion, not a wrapper.

GSAP, named

We say GSAP-native every time it matters, because the distinction from Framer Motion is the product. Never blur it into generic "animation library" language.

Hand-written components. Copy the code, read every line.

Written, not generated

Every component is hand-built by Good Fella. We never suggest anything here was generated or AI-made, and we never leave that ambiguous in a sentence.

Respects prefers-reduced-motion. Types shipped, not bolted on.

Accessible by default

Reduced-motion support and TypeScript types are facts we state, not features we sell. Mention them where a developer would actually check for them.

Short sentences win

One claim per sentence. Cut adjectives before nouns. If a line reads like marketing copy about the product, rewrite it as the product.

Describing motion

Do

"Runs at 60fps with a 240ms ease."

Don't

"Effortless, instant animation that just works."

Pricing page

Do