shadcn-ui
Build beautiful, accessible UIs with shadcn/ui components. Use this skill when creating forms, dialogs, tables, sidebars, or any UI components in Next.js. Covers installation, component patterns, react-hook-form integration with Zod validation, and dark mode setup.
Third-Party Agent Skill: Review the code before installing. Agent skills execute in your AI assistant's environment and can access your files. Learn more about security
Installation for Agentic Skill
View all platforms →skilz install mjunaidca/mjs-agent-skills/shadcn-uiskilz install mjunaidca/mjs-agent-skills/shadcn-ui --agent opencodeskilz install mjunaidca/mjs-agent-skills/shadcn-ui --agent codexskilz install mjunaidca/mjs-agent-skills/shadcn-ui --agent geminiFirst time? Install Skilz: pip install skilz
Works with 22+ AI coding assistants
Cursor, Aider, Copilot, Windsurf, Qwen, Kimi, and more...
Extract and copy to ~/.claude/skills/ then restart Claude Desktop
git clone https://github.com/mjunaidca/mjs-agent-skillscp -r mjs-agent-skills/docs/taskflow-vault/skills/engineering/shadcn-ui ~/.claude/skills/Need detailed installation help? Check our platform-specific guides:
Related Agentic Skills
tailwind-shadcn-setup
by vanman2024
Setup Tailwind CSS and shadcn/ui component library for Next.js projects. Use when configuring Tailwind CSS, installing shadcn/ui, setting up design...
spanish-language-tutor
by sandraschi
Comprehensive Spanish language expert covering grammar, conversation, regional dialects, and language learning strategies
frontend-dev-guidelines
by diet103
Frontend development guidelines for React/TypeScript applications. Modern patterns including Suspense, lazy loading, useSuspenseQuery, file organiz...
torch-geometric
by davila7
Graph Neural Networks (PyG). Node/graph classification, link prediction, GCN, GAT, GraphSAGE, heterogeneous graphs, molecular property prediction, ...
Agentic Skill Details
- Repository
- mjs-agent-skills
- Stars
- 1
- Forks
- 2
- Type
- Technical
- Meta-Domain
- development
- Primary Domain
- javascript
- Market Score
- 17
Agent Skill Grade
D Score: 67/100 Click to see breakdown
Score Breakdown
Areas to Improve
- Description needs trigger phrases
- No TOC in 853-line file
- No layered references
Recommendations
- Focus on improving Pda (currently 15/30)
- Address 2 high-severity issues first
- Add trigger phrases to description for discoverability
Graded: 2026-01-24
Developer Feedback
I've been digging through component libraries lately, and shadcn-ui's approach to composition caught my attention—especially how it handles the abstraction layer between your design system and actual usage patterns, though the 67/100 suggests there might be some friction in how that story gets communicated.
Links:
The TL;DR
You're at 67/100, which puts you in D territory. This is based on Anthropic's best practices for agentic skills. Your Writing Style is solid at 8/10—the technical voice is clean and you've got good imperative structure. But Progressive Disclosure Architecture is dragging you down at 15/30. That's the real bottleneck here.
What's Working Well
- Clear triggers in your description - "forms, dialogs, tables, sidebars" gives agents concrete activation points
- Comprehensive component coverage - You're hitting the real problems developers face: forms with validation, dark mode, tables, dialogs
- Good imperative tone - Section headers and code comments are directive and clear; this is how skills should sound
- Practical examples - You're showing multiple variants and component composition patterns, not just theory
The Big One: Split That 853-Line File
This is killing your PDA score. Right now you've got everything in one massive SKILL.md file—all 10 core patterns with full boilerplate, imports repeated endlessly, and zero layered references. That's not scalable, and it tanks your token economy.
Here's the fix: Create a references/ directory and split your patterns:
references/forms.md- Form patterns with validation (extract lines ~200-300)references/tables.md- Table patterns (extract ~50-100 lines)references/dialogs.md- Dialog pat...
Browse Category
More development Agentic SkillsReport Security Issue
Found a security vulnerability in this agent skill?
Report Security Issue
Thank you for helping keep SkillzWave secure. We'll review your report and take appropriate action.
Note: For critical security issues that require immediate attention, please also email security@skillzwave.ai directly.