Manages shadcn/ui components, presets, and registries via the shadcn CLI.
npx skills add https://github.com/coleYab/usacr --skill shadcn-coleyab
Please help me install this Agent Skill. Skill: shadcn Source: https://github.com/coleYab/usacr/tree/main/.agents/skills/shadcn Command: npx skills add https://github.com/coleYab/usacr --skill shadcn-coleyab
npx shadcn@latest info, fetches docs, and generates code using FieldGroup, Field validation states, and semantic tokens. ## Quick Start Ask the assistant to add a shadcn/ui component such as a dialog or build a form following shadcn/ui best practices in your project.High-intent search queries and answers about installing and using this skill.
Run npx shadcn@latest add followed by 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 npx shadcn@latest add <component> --dry-run to see affected files, then --diff <file> to compare upstream changes against your local version. Apply upstream updates per file while preserving local modifications, 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, and components like Select, ToggleGroup, Slider, and Accordion have different props between the two.
Pass the preset code directly to npx shadcn@latest apply <code> for existing projects or npx shadcn@latest init --preset <code> for new ones. Never decode preset codes manually; use preset decode, preset url, or preset resolve commands to inspect them.
Yes, the CLI supports templates for Vite, TanStack Start, React Router, Astro, and Laravel. All except Laravel support monorepo scaffolding via the --monorepo flag.
The styling rules require flex with gap-* instead of space-y-*, 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 across light and dark modes.
zaid-khan-codeConfigure shadcn/ui and Tailwind CSS v4 for Next.js and React projects.
hamzaPixlScaffold a Next.js admin dashboard with shadcn/ui, RBAC UI, and backend API integration.
murphytruemanAudit design system theme coverage, consistency, and component tier propagation.
JNZader-VaultBuild React interfaces with Mantine components, forms, charts, and notifications.