skills.rest
auto-medica-labs
auto-medica-labsOFFICIAL
Explore all skills by this author →
WebsiteGitHub

shadcn

Manage shadcn components and projects with CLI tools.

6|2|Updated May 23, 2026
Search Tags:#UI development#CLI tools#shadcn#component management#preset application
One-click install
npx skills add https://github.com/auto-medica-labs/keb --skill shadcn-auto-medica-labs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: shadcn
Source: https://github.com/auto-medica-labs/keb/tree/main/.pi/skills/shadcn
Command: npx skills add https://github.com/auto-medica-labs/keb --skill shadcn-auto-medica-labs

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires shadcn/ui, shadcn/cli, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill helps developers manage shadcn components and projects efficiently, streamlining UI development and optimization.

Core Features & Use Cases

  • Component Management: Add, search, fix, debug, style, and compose UI using shadcn components.
  • Project Context: Provides project configuration, component documentation, and usage examples.
  • CLI Tools: Offers commands for initializing projects, applying presets, and adding components.
  • Use Case: For a developer working on a UI project with shadcn, this Skill can help quickly add a component like a button or card, apply a preset to style the project, or resolve issues in component usage.

Quick Start

To apply a preset, run the command: npx shadcn@latest apply <preset-code>

Frequently Asked Questions about shadcn

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add shadcn components to my UI project?▼

To add shadcn components to your UI project, use the shadcn CLI tools to initialize the project, resolve component dependencies, and apply UI styling configurations automatically.

What is the best way to apply a UI preset with shadcn?▼

The best way to apply a UI preset with shadcn is by running the command `npx shadcn@latest apply <preset-code>` to instantly style your project using predefined configurations.

Do I need shadcn/ui installed to manage shadcn components?▼

Yes, you need shadcn/ui and associated CLI tools installed, as they are required for component resolution, project configuration, and UI styling within the shadcn framework.

Can I debug and fix shadcn component usage issues during development?▼

Yes, you can debug, fix, and style shadcn components during development by leveraging project context, component documentation, and usage examples provided by the management tools.

Why does shadcn component resolution fail in my project?▼

Shadcn component resolution fails when project settings are misconfigured or required CLI tools are missing, preventing the framework from properly resolving dependencies and applying UI styles.

What does the shadcn Skill do for UI development?▼

The shadcn Skill manages shadcn components and projects, optimizing UI development by handling tasks such as adding components, applying UI presets, and configuring project settings.

Related Skills

Explore More Software Engineering Skills→
yuheitomiyuheitomi

set-up-biome

Configure Biome and Shadcn/UI preferences in React projects with pnpm.

Community
Advanced
SantiagoisperSantiagoisper

canary

Monitor deployed applications by comparing periodic screenshots against pre-deployed baselines.

Community
Intermediate
TW-NLPTW-NLP
91

web-artifacts-builder

Create interactive HTML artifacts from React projects with Tailwind CSS and shadcn/ui.

Community
Advanced
LuisSambranoLuisSambrano
7

radix-ui

Guide accessible design system development with Radix UI primitives.

Community
Intermediate