Motion Garden

Motion Garden · Agent-ready registry

147 instruments.
One bench.

Animated React components, live on this page, every prop a dial. One copy hands your coding agent the full brief: source, dependencies, props and integration rules.

Enter the catalogthe Cook Book
Registry 147 units [live · tunable]
Exhibit α-01Backgrounds35 units

αBackgrounds

Full-screen animated backgrounds. They sit behind your content and set the tone.

All 35 Backgrounds →
Exhibit β-02Text Animations26 units

βText Animations

Text that moves: morphing headlines, counters, and scroll effects.

All 26 Text Animations →
Exhibit γ-03Power-User Systems32 units

γPower-User Systems

Complete widgets with real state: command menus, file trees, docks, and agent UIs for permissions, patch review and activity logs.

All 32 Power-User Systems →
Exhibit δ-04Micro-interactions43 units

δMicro-interactions

Small touches on buttons and cards. You feel them more than you see them.

Pixel Transition

Reveal a second layer through a random pixelated dissolve on hover.

Border Glow

A cursor-proximity gradient border with an outer glow.

Spotlight Shell

A card shell with 3D magnetic tilt, radial glow, and a shimmer sweep.

Animated Hamburger

A three-bar hamburger that morphs to an X, driven by a toggle prop.

Morph Dialog

A dialog that morphs open from its trigger via shared-layout animation, with elements that travel between card and panel.

Blueprint Card

A technical-drawing card. Dashed envelope, accent rules, corner nodes, and a soft glow that draw in on mount.

All 43 Micro-interactions →
Exhibit ε-05Hero Templates11 units

εHero Templates

Ready-made hero sections. One strong opening above the fold.

All 11 Hero Templates →
Exhibit ε-05Calibration2 dials

εCalibration

Every dial is real. Turn one.

Trace the edges

Every component in the catalog has controls like these. Tune it live, watch the props table update, then copy the code — or the full brief for your agent.

Plate ζ-06Open archive147 units

Nothing stays in the shadow.

Every component renders live, so you can tune it before your agent writes a line. The pieces below run on this page. The full catalog is one click away.

Browse the source