What is shadcn/ui?

shadcn/ui, created by the developer known as shadcn, describes itself as a way to build your own component library rather than a library you depend on. You run the CLI, it writes the component's source into your repository, and from then on the code is yours: you read it, edit it and commit it. Components are styled with Tailwind CSS and built on headless primitives, originally Radix UI and now also Base UI.

How it works

1. npx shadcn@latest init creates components.json, which records your style, Tailwind CSS file, icon library and import aliases, and adds the base CSS variables.
2. npx shadcn@latest add button fetches the Button item, installs its npm dependencies and writes components/ui/button.tsx.
3. You import it like any local file: import { Button } from "@/components/ui/button".

{
  "$schema": "https://ui.shadcn.com/schema.json",
  "style": "new-york",
  "rsc": true,
  "tsx": true,
  "tailwind": { "config": "", "css": "app/globals.css", "baseColor": "neutral", "cssVariables": true },
  "iconLibrary": "lucide",
  "aliases": { "components": "@/components", "ui": "@/components/ui", "utils": "@/lib/utils" }
}

The same add command accepts a URL or a namespaced name, which is how third-party libraries plug in. Any shadcn registry item installs the same way.

Why it matters

• Ownership. No waiting on maintainers for a prop. Change the markup when the design needs it.
• Theming by variables. Components read CSS variables like --primary, --muted and --ring, so a theme is a block of variable values.
• An ecosystem. Because the registry format is open, many libraries publish compatible components that share the same variables and conventions.

Trade-offs

Owning the code means owning upgrades. When upstream fixes a bug, you re-add the component or apply the diff yourself, and local edits make that harder. Treat modified components as your own code, with your own tests, and keep changes in variants or wrapper components where you can so a fresh copy is easy to compare. shadcn/ui is also a starting point rather than a design system: it gives you well-built defaults, and product-specific patterns and rules are still yours to define.

How MiniDev UI relates

MiniDev UI is shadcn-compatible. Components install with the same CLI, build on Base UI like shadcn's Base UI styles, and map the kit's tokens onto shadcn's variable names, so existing shadcn components and MiniDev components share one theme. It adds larger pieces too, from a Command palette and Data table to AI chat components and full pages. Tune your variables with the shadcn theme generator.