Quick Start

Create your first shadcn registry in minutes.

Get Started

Prerequisites

Create a Registry

npx create-scn-stack

Follow the interactive prompts to configure your registry. Or skip prompts entirely:

npx create-scn-stack my-ui --yes

The CLI will:

  1. Ask you for a registry name, framework, docs engine, and more
  2. Generate all project files with the registry include pattern
  3. Create starter components with live preview demos
  4. Set up theme scaffolding and v0 integration
  5. Generate llms.txt and .scn-stack.json config
  6. Install dependencies and the shadcn AI skill
  7. Initialize a git repository

Add to an Existing Project

Already have a project? Add a registry to it:

npx create-scn-stack init

This detects your framework, creates registry.json, components.json, adds a registry:build script, and optionally scaffolds documentation. See init command for details.

Start Development

cd my-ui
pnpm dev

Your registry is now running at http://localhost:3000 with:

  • A landing page with install instructions
  • Documentation with live component previews
  • Registry endpoints at /r/registry.json

Add Components, Hooks & Blocks

npx create-scn-stack add-component input -d "A text input component."
npx create-scn-stack add-hook use-toggle -d "A toggle state hook."
npx create-scn-stack add-block login-form -d "A login form block."

Each command creates the source file, adds it to registry.json, generates a doc page, and updates navigation — all in one command.

Build & Validate

npx shadcn registry validate
pnpm registry:build

This validates your registry schema and generates static JSON files in public/r/.

Deploy

Deploy to Vercel, Netlify, or any platform that supports your framework. Your registry is a standard web app — no special hosting required.

Once deployed, anyone can install your components:

npx shadcn add @my-ui/button

What is a shadcn Registry?

A shadcn registry is a way to distribute components, hooks, blocks, and other code that users can install with the shadcn CLI.

Unlike npm packages, registry components are copied into the user's project as source code they own and can customize. It's the same pattern that shadcn/ui itself uses.

Why Build a Registry?

  • Design systems — distribute your company's component library
  • Open source — share themed or specialized components with the community
  • Internal tools — standardize UI across projects in your org
  • Commercial — sell premium component collections

Next Steps