shadcn/ui
The official shadcn/ui skill for AI agents. Find, add, compose, customize, and debug UI components using your project configuration, current component docs, and the shadcn CLI.
Originale Workflows für Websites, Bilder, Präsentationen und bewegte Inhalte.
The official shadcn/ui skill for AI agents. Find, add, compose, customize, and debug UI components using your project configuration, current component docs, and the shadcn CLI.
Audit a codebase, prioritize evidence-backed findings, and write implementation plans for another agent or developer.
Find, customize and integrate shadcn/ui components in an application.
Build responsive interface components with shadcn/ui, Tailwind CSS and design-system guidance.
Use whenever the user wants to build or modify a chat, agent, or tool-calling UI in a React 19 + Tailwind v4 project — especially if the code imports from `@/components/agent-elements/*` or the project has that folder on disk. Triggers: "agent chat", "tool call UI", "streaming chat", "plan approval", "AgentChat", "InputBar", "tool renderer", mentions of Agent Elements, or requests to add a new agent surface with shadcn. Do NOT use for plain chat UIs that don't need tool/plan/approval cards, or for projects already committed to a different agent UI kit.
Set up Tailwind v4 + shadcn/ui themed UI with dark mode. Install deps, configure CSS variables via @theme inline, wire dark mode toggle, verify. Use whenever the user mentions Tailwind v4, setting up Tailwind theming, shadcn/ui colours, dark mode, or troubleshooting colours not working, tw-animate-css errors, @theme inline conflicts, @apply breaking after upgrade, or v3 → v4 migration issues.
Eine kleine, sorgfältig gestaltete Bibliothek. Weitere Skills folgen.