shadcn

Manage shadcn/ui components and presets via the npx CLI.

426|199|Updated Aug 13, 2025

Search Tags:#automation #ui #docs #shadcn #presets #component-management #registries

Ready to run

npx skills add https://github.com/leonvanzyl/agentic-coding-starter-kit --skill shadcn-leonvanzyl

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: shadcn
Source: https://github.com/leonvanzyl/agentic-coding-starter-kit/tree/main/.agents/skills/shadcn
Command: npx skills add https://github.com/leonvanzyl/agentic-coding-starter-kit --skill shadcn-leonvanzyl

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Manages shadcn/ui components, presets, and documentation within a project to ensure consistent UI tooling and efficient onboarding for new apps.

Core Features & Use Cases

Provides project context, component docs, and usage examples for shadcn/ui components.
Supports actions like adding, searching, fixing, debugging, styling, and composing UI across registries and presets.
Triggers for initialization and preset switching (e.g., "shadcn init", "create an app with --preset", or "switch to --preset").

Quick Start

Run the CLI in your project to initialize or update shadcn/ui components and presets.

Frequently Asked Questions about shadcn

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

FAQPage Schema

How do I add and manage shadcn/ui components in an existing project?▼

Initialize and manage shadcn/ui components by running CLI-driven operations via npx shadcn@latest within a project containing a components.json file, enabling actions such as adding, searching, and styling components.

What is a shadcn/ui preset and when do I need to switch presets?▼

A shadcn/ui preset defines component configurations and styling. You switch presets when initializing new apps or changing UI tooling approaches using triggers like 'switch to --preset'.

Can I use shadcn/ui component registries without a components.json file?▼

No, shadcn/ui component registries require a components.json file to provide project context awareness. This file ensures consistent UI tooling and enables actions like composing UI across registries and presets.

How do I debug and fix styling issues in shadcn/ui components?▼

Debug and fix shadcn/ui component styling issues using CLI-driven debugging actions. This workflow leverages project context and component documentation to resolve styling inconsistencies across registries.

What's the best way to find usage examples for shadcn/ui components?▼

Find usage examples for shadcn/ui components by using CLI search and documentation features. This supplies project context and component docs directly within your working environment.

Why does my shadcn init command fail when creating a new app?▼

Your shadcn init command may fail if the project lacks proper setup for component registries or if the components.json file is missing. Ensure your project environment supports CLI-driven operations before initializing.