feat: add shadcn/ui skill for AI-assisted component generation
Nobody has claimed this yet.
Assessment
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Newbie friendliness
- 50/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Quiet
- Tech stack
- tailwindcss
- Domain
- frontend
Research direction
Start by checking the existing component setup and whether components.json is present. Review how the shadcn skill uses shadcn info --json, then add the skill so AI assistants receive the repository's framework, Tailwind, aliases, components, and icon-library context; done means detection and context injection work as described.
Written by the indexing model from the issue text.
Description
Summary
Add a shadcn/ui skill to give Claude Code (and other AI assistants) deep contextual knowledge of shadcn/ui components, patterns, and best practices when working in this repo.
What are shadcn skills?
Skills equip AI assistants with project-aware knowledge of shadcn/ui. They work by:
- Project detection — activates automatically when
components.jsonexists - Context injection — runs
shadcn info --jsonto gather project config (framework, Tailwind version, aliases, installed components, icon library) - Pattern enforcement — the AI follows shadcn/ui composition rules when generating code
This enables natural language requests like:
- "Add a login form with email and password fields"
- "Create a settings page with profile update functionality"
- "Build a dashboard with a sidebar, stats cards, and a data table"
Installation
pnpm dlx skills add shadcn/ui
Why
This project already uses Tailwind CSS and a component-based UI. Adding the shadcn skill would let AI assistants generate components that are consistent with shadcn/ui patterns, theming (CSS variables, OKLCH colors, dark mode), and the existing design system — reducing manual fixups after AI-generated code.
References
- Dominant language
- TypeScript
- Stars
- 1.6k
- Forks
- 202
- PR merge metrics
- No merged PRs in 30d
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from CopilotKit/OpenGenerativeUI
-
bug
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
-
enhancement
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
-
Difficulty 4/5 3-5 days Newbie friendliness 48/100
CopilotKit/OpenGenerativeUI#87 · 2 comments ·
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
-
Difficulty 4/5 3-5 days Newbie friendliness 45/100
All issues in CopilotKit/OpenGenerativeUI
Similar issues
-
clawsweeper:linked-pr-open clawsweeper:no-new-fix-pr clawsweeper:source-repro impact:message-loss issue-rating: 🦞 diamond lobster maturity:stable P2
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
Eynzof/Hermes-CN-Desktop#616 ·
-
ZCode 3.14.3 に対応する Open
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
supermomonga/zcode-acp#24 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
growthbook/growthbook#7100 ·
-
triage
Difficulty 1/5 1-3 hours Newbie friendliness 88/100