
Template details
Registry Starter
Free open-source Next.js and shadcn/ui Registry template for building and sharing an AI-native design system.
About this template
Registry Starter is a free, open-source Next.js template built around the shadcn/ui Registry that lets you author, preview, and share a component registry as an AI-native design system. It ships as a deployable Vercel app that turns a single registry.json file into distributable component definitions.
What is Registry Starter?
Registry Starter is a template application that wraps the shadcn/ui Registry system in a ready-to-deploy Next.js app. It reads a repository registry.json file listing registry items (components, blocks, layouts, and a registry:theme item holding Tailwind configuration and CSS variables) and generates per-component JSON endpoints during build and dev. The output is a hosted registry that AI tools and the shadcn/ui CLI can consume. It is distributed on GitHub by Vercel.
Key Features
- shadcn/ui Registry integration — a
registry.jsonat the repo root is compiled into/r/component-name.jsonendpoints containing each component's files, content, and metadata. - Next.js App Router structure — routes are split into
app/(registry)for registry pages andapp/demofor UI primitives, components, and blocks. - Open in v0 buttons — every component exposes a button that opens v0.dev with a prepopulated prompt and a URL pointing back to the registry's
/r/...jsonendpoint, so v0 receives the theme and related code. - CSS-variable theming — restyle every component by editing the tokens in
globals.css; custom fonts work vianext/font/googleor an@font-facerule. - MCP support — placing
registry.jsonand its items in the/publicfolder lets the shadcn/ui CLI's MCP command power tools like Cursor and Windsurf. - Token-based authentication — a
REGISTRY_AUTH_TOKENenvironment variable plusmiddleware.tsmatching/r/:path*protects registry JSON; v0 passes the token as a search parameter. - One-click Vercel deploy — a Deploy with Vercel button clones the GitHub repo and provisions a project named for your registry.
- Local workflow —
pnpm installthenpnpm devserves the app on localhost:3000.
Who is it for?
- Design system maintainers: publish a shared registry of components, themes, and blocks that other teams and AI tools can pull from a single JSON endpoint.
- Frontend developers using v0: open any registry component directly in a v0 chat with its styles and files preloaded.
- Teams standardizing on shadcn/ui: centralize Tailwind tokens and CSS variables in one theme item so every consumer inherits the same look.
- Developers wiring AI coding assistants: expose the registry over MCP to Cursor or Windsurf.
What can you do with Registry Starter?
- Share a themed component library: edit
globals.csstokens, then let the CLI generate/r/...jsonfiles that others install into their own projects. - Prototype in v0: use the per-component Open in v0 button to start a chat seeded with your design system instead of default styles.
- Gate a private registry: add the middleware and token so only callers with the correct
tokenquery parameter can read registry JSON — the README notes this protects/r/:pathroutes but not the UI or component previews.
Pros and cons
- The token middleware protects registry JSON endpoints only; component preview UI stays public unless separately secured.
- v0 and other AI tools need the
tokensearch parameter to reach a protected registry.












