use-shadcn

SkillDev tools

Build shadcn/ui components following monorepo structure and coding standards. Use when the user types /use-shadcn.

Available today. Use it from your connected AI after setup.

No other account needed.

Connect ahel once, and every AI you use reads what you have installed.

Then ask your AI: use the use-shadcn skill

What this skill tells your AI

The instructions your AI receives, as published by blockmatic/basilic in .agents/skills/workflow/use-shadcn/SKILL.md and read by ahel’s review.

Build shadcn/ui components following monorepo structure and coding standards.

Use MCP servers: Use shadcnui-official for single components/variants/canonical patterns, use shadcnui-jpisnice-react for full blocks/demos/page templates, only call MCP when unsure about implementation or encountering errors
Install in @repo/ui: Install components in packages/ui/src/components/, ensure components.json points to @repo/ui/lib/utils and @repo/ui/components, follow existing component organization patterns
Follow monorepo import patterns: Import from @repo/ui/components/* never directly from packages/ui, use @repo/ui/lib/utils for utilities like cn, import Radix primitives from @repo/ui/radix never directly from @radix-ui/react-*
Apply coding standards: Follow TypeScript rules (interfaces, type inference, RORO pattern), use class-variance-authority (cva) for variants, apply mobile-first responsive design, follow linting rules (Biome + ESLint)
Verify and test: Run pnpm lint:fix to ensure code quality, verify imports work correctly in consuming apps, test component functionality and responsiveness

Advanced