Interface craft for modern React teams
Gamma UI pairs Tailwind and Motion with a shadcn-compatible CLI. Copy production-ready blocks — from WebGL backgrounds to dense app chrome — without fighting your stack.
React
Next.js
Motion
Tailwind
shadcn/uiOne of 30+ motion-ready components in the registry.
01 — Library
Components that feel designed, not assembled
Live previews from the registry — motion, 3D, and product UI patterns you can install in one command.
(components.json)
npx shadcn add
Thomas has arrived home
Daily step goal reached!
Team meeting in 30 minutes
3 tasks due today
Heart rate elevated
New message from manager
02 — Workflow
Every step checked off, one task at a time
From scaffold to ship — Gamma UI follows the same shadcn workflow you already know. Watch the pipeline advance as each task completes.
Setup pipeline
Tasks run in order — each step checks off when done.
0/6 complete · 0%
- In progress
Scaffold your app
Create a Next.js project with TypeScript and Tailwind.
Processing…
- Pending
Initialize shadcn/ui
Run the CLI init and pick your theme tokens.
- Pending
Connect Gamma UI registry
Point shadcn at the Gamma UI component registry.
- Pending
Add components
Install blocks with npx shadcn@latest add …
- Pending
Compose your UI
Drop components into pages and tweak with Tailwind.
- Pending
Ship to production
Deploy — accessible, motion-ready UI in the wild.
03 — Showcase
Websites in the wild
A rolling gallery of sites — each card shows the preview, name, and type (studio, personal, product, and more).
Ready when you are
Drop components in. Ship faster.
Same shadcn workflow — copy, paste, customize. Your design system, elevated.