shadcn

shadcn is the official CLI for shadcn/ui, a code-distribution platform (rather than a traditional npm component library) that copies component source directly into your project via npx shadcn add. Components are built on Radix UI/Base UI primitives and styled with Tailwind CSS, so once added they are fully owned, editable files rather than an opaque installed dependency.

The CLI handles project initialization, adding individual components or third-party registry items, building custom registries, and migrating between framework versions, and it works across React, Next.js, Vite, Laravel, and other supported frameworks.

What You Get

• A CLI (init, add, build, diff, eject, migrate, search, view) for scaffolding and managing UI components as owned source code
• A component registry protocol so teams and third parties can publish and consume their own custom component registries, not just the official one
• Components built on accessible headless primitives (Radix UI, Base UI) styled with Tailwind CSS
• An MCP (Model Context Protocol) server integration (src/mcp/) for AI coding assistants to browse and install components programmatically
• Framework support spanning React, Next.js, Vite, and Laravel, with migration tooling between major CLI/component versions

Common Use Cases

• Bootstrapping a new React/Next.js project’s design system with accessible, pre-built but fully customizable components
• Adding individual components (buttons, dialogs, forms) to an existing codebase without pulling in an opaque UI library dependency
• Publishing an internal or public custom component registry for a team or open-source project to consume via the same CLI
• Letting AI coding assistants discover and install components directly through the CLI’s MCP server integration

Under The Hood

Architecture — The GitHub repo is a pnpm/Turborepo monorepo: apps/v4 hosts the documentation and marketing site, while packages/shadcn is the published CLI (the shadcn npm package), packages/react publishes unstyled primitive components separately, and packages/helpers/packages/tests support the build and test pipeline. Inside the CLI package, src/commands/ holds one file per subcommand (add.ts, init.ts, build.ts, diff.ts, eject.ts, migrate.ts, preset.ts, search.ts, view.ts, mcp.ts), src/registry/ implements the registry-fetching and component-resolution protocol (api.ts, builder.ts, config.ts, address.ts), and src/mcp/ exposes the CLI’s functionality over the Model Context Protocol for AI-assistant integrations.

Tech Stack — TypeScript-first (87% of the codebase), with MDX (9%) for documentation content and CSS (4%) for styles. The CLI itself is a Node.js package (published as shadcn on npm) using standard CLI-building conventions; components depend on Radix UI/Base UI for accessible primitives and Tailwind CSS for styling, with framework adapters targeting Next.js, Vite, and Laravel.

Code Quality — Nearly every command file has a paired .test.ts (add.test.ts pattern seen for apply, build, docs, eject, preset, and others), giving the CLI meaningful automated coverage of its core flows. The project ships over 100 tagged releases across the shadcn and @shadcn/react packages with a consistent, high release cadence (roughly 79 commits/month), and the repo’s RELEASING.md/CONTRIBUTING.md document a mature, structured release and contribution process for a project with 584 contributors.

API Design — The CLI mirrors familiar scaffolding-tool ergonomics (init then add <component>), with diff and eject giving developers escape hatches to inspect or fully detach from CLI-managed updates — a deliberate design choice reflecting the project’s “you own the code” philosophy rather than the typical package-manager update model. The registry protocol (documented separately from the CLI itself) lets third parties extend the same add command to pull from custom sources without CLI changes.