skills.rest
rbaumier
rbaumierCOMMUNITY
Explore all skills by this author →
Website𝕏@rbaumierGitHub

shadcn

Manage shadcn/ui component installation, updates, and audits via the shadcn CLI.

4|Updated Feb 12, 2026
Search Tags:#theming#ui#components#cli#tailwind#shadcn#component-registry
One-click install
npx skills add https://github.com/rbaumier/skills --skill shadcn-rbaumier
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: shadcn
Source: https://github.com/rbaumier/skills/tree/main/shadcn
Command: npx skills add https://github.com/rbaumier/skills --skill shadcn-rbaumier

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Manages the lifecycle of shadcn/ui components in frontend projects so teams can add, update, and audit UI components without breaking imports, styles, or local customizations. It prevents unsafe manual file edits by directing all registry and preset operations through the shadcn CLI and enforces composition, styling, and accessibility rules for consistent UI integration.

Core Features & Use Cases

  • Safe component installation & previews: Use the CLI with --dry-run, --diff, and --view to preview changes, diffs, and resolved file paths before writing files.
  • Smart updates & merges: Intelligent workflows for updating upstream components while preserving local modifications using per-file diffs and guided merge decisions.
  • Project-aware guidance: Reads project context (package manager, aliases, tailwind version, iconLibrary, base) to fix imports, register theme variables correctly, and select the correct primitives (base vs radix).
  • Auditing & rules enforcement: Built-in checklists and rule sets for styling, composition, forms, icons, and accessibility to catch common integration mistakes.
  • Registry & preset management: Search, view, and install from custom registries, and safely switch or merge presets (reinstall, merge, skip) per user choice.

Quick Start

Preview component additions and diffs with the project's package runner by running a dry-run add command such as npx shadcn@latest add button --dry-run to inspect files and CSS changes before applying them.

Frequently Asked Questions about shadcn

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

FAQPage Schema
How do I update shadcn/ui components without losing local customizations?▼

Preview shadcn/ui component changes before writing files by running the CLI with the --dry-run and --diff flags, such as `npx shadcn@latest add button --dry-run`. This outputs the resolved file paths and CSS changes for inspection without modifying your codebase.

Can I install shadcn/ui components from custom registries?▼

Yes, you can search, view, and install shadcn/ui components from custom registries. The process reads project context like package manager and aliases to resolve imports correctly and register theme variables during the custom registry installation.

How does shadcn/ui integrate with existing Tailwind configurations?▼

When switching or merging shadcn/ui presets, you can safely choose between reinstalling, merging, or skipping per your preference. This process ensures theme variables are registered correctly and style rules are enforced without breaking existing UI integration.

What are the limitations of manually editing shadcn/ui component files?▼

Manually editing shadcn/ui component files is discouraged because it bypasses the shadcn CLI, leading to broken imports, styles, or local customizations during updates. All registry and preset operations should be directed through the CLI for deterministic file changes.

Related Skills

Explore More Software Engineering Skills→
justinlevinedotmejustinlevinedotme
7

vite-shadcn-tailwind4

Initialize shadcn/ui with Tailwind v4 in Vite projects.

Community
Advanced
NicholasSutinNicholasSutin

shadcn

Manage shadcn/ui component installation, configuration, and styling in Next.js and Vite projects.

Community
Intermediate
fusenginefusengine
22

theming-tokens

Organize primitive, semantic, and component design tokens for UI theming.

Community
Intermediate
petbrainspetbrains
13

frontend-shadcn

Provide copy-paste React/Next.js UI components built on Radix UI and Tailwind CSS.

Official
Intermediate