Category: Design
shadcn/ui
The official shadcn skill for adding shadcn/ui components via the CLI to match your project config and docs.
Works with
What it does
- Runs the
shadcnCLI with your project's package manager (npm, pnpm, bun) - Reads your project config and installed components
- Looks up component docs and examples with
shadcn docs - Adds components as source code you can edit
When to use it
Makes your agent add components through the official CLI instead of imitating them by hand. It runs shell commands, so review it before installing.
How to install
- Run the command below in your terminal. Pick the agents you use (Claude Code, Codex, Cursor, Gemini CLI, Copilot, and more) and it installs into the right folder.
npx skills add https://github.com/shadcn/ui --skill shadcn
- To install manually, download the
shadcnskill folder from the GitHub repository and copy it into your agent's skills folder, such as~/.claude/skills/or.cursor/skills/. - Ask your agent for a related task and the skill is used automatically.