shadcn

Run npx shadcn@latest add followed by the component names, using your project's package runner (npx, pnpm dlx, or bunx). Check installed components first with npx shadcn@latest info, and preview changes with --dry-run or --diff before writing files.

Use the smart merge workflow: run npx shadcn@latest add <component> --dry-run to see affected files, then --diff per file to compare upstream changes. Apply upstream updates manually where local modifications exist, and never use --overwrite without explicit approval.

The base field in components.json determines the primitive library and component APIs. Radix uses asChild for composition while base uses render; Select, ToggleGroup, Slider, and Accordion also have different props between the two. Check the base field via npx shadcn@latest info.

Pass the preset code directly to npx shadcn@latest apply <code> for existing projects or init --preset <code> for new ones. Never decode codes manually; use preset decode, preset url, or preset resolve to inspect them, and choose overwrite, partial, merge, or skip when switching.

Yes, the CLI supports templates for Next.js, Vite, TanStack Start, React Router, Astro, and Laravel. All except Laravel support monorepo scaffolding via the --monorepo flag.

The skill's styling rules require flex with gap-* instead of space-y-*/space-x-*, and semantic tokens like bg-primary or text-muted-foreground instead of raw colors like bg-blue-500. This keeps components themeable through CSS variables and consistent in dark mode.