Shadcnui
shadcn/ui copy-paste React components. Use for modern React UI.From its SKILL.md
npx -y skills add G1Joshi/Agent-Skills --skill shadcnuiAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 12 stars12 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
1.1 KB, 278 tokens by cl100k_base, as published. Nobody here has run it
shadcn/ui
shadcn/ui is not a component library; it's a collection of reusable components that you copy and paste into your apps. Built on Radix UI and Tailwind.
When to Use
- Ownership: You want full control over the component code.
- Next.js: The de facto standard for modern Next.js apps.
- Modern: The "Vercel Aesthetic".
Core Concepts
Copy/Paste
npx shadcn-ui@latest add button. This adds components/ui/button.tsx to YOUR project.
Radix UI
The headless, accessible primitives (Dialog, Tooltip) that power the interactions.
cn Utility
A helper to merge Tailwind classes conditionally (clsx + tailwind-merge).
Best Practices (2025)
Do:
- Customize: Edit the component code! That's the point.
- Use
lucide-react: The standard icon set. - Use Blocks: Copy larger blocks (Login Forms, Dashboards) from the registry.
Don't:
- Don't treat it like MUI: There is no npm package to update. You own the code.
References
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.