shadcn

Manage shadcn/ui components, presets, and registries across projects.

Updated Mar 30, 2026
One-click install
npx skills add https://github.com/Jkker/react-template --skill shadcn-jkker
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: shadcn
Source: https://github.com/Jkker/react-template/tree/main/.agents/skills/shadcn
Command: npx skills add https://github.com/Jkker/react-template --skill shadcn-jkker

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams manage shadcn/ui components, presets, and registries across projects, ensuring consistent UI patterns and streamlined setup.

Core Features & Use Cases

  • Centralizes knowledge about shadcn/ui integration, including initialization, documentation access, and component management.
  • Provides project context awareness (registries, presets, and component imports) to speed up setup and maintenance.
  • Supports guidance for safe, registry-driven workflows with validation and diffing when updating components.

Quick Start

Run vpx shadcn init --preset base-nova to bootstrap shadcn UI in your project.

Frequently Asked Questions about shadcn

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

FAQPage Schema
How do I initialize shadcn/ui in a Vite or Next.js project?

To initialize shadcn/ui, run the init command with a preset like base-nova to bootstrap component configurations and aliases across Next.js or Vite project setups.

Does shadcn/ui work with TanStack Router and monorepos?

Yes, shadcn/ui supports integration with TanStack Router setups and monorepos. The workflow provides project context awareness to manage component imports and registries effectively across these architectures.

How do I search registries and view documentation for shadcn/ui components?

You can search registries and view documentation for shadcn/ui components directly through the registry-aware workflow. This centralizes component discovery and provides access to necessary integration docs.

What is a registry-aware workflow for updating shadcn/ui components?

A registry-aware workflow for shadcn/ui components ensures safe updates by utilizing validation and diffs. This approach maintains consistent UI patterns and prevents breaking changes when installing or modifying components.

Do I need frontmatter and specific directives for shadcn/ui presets?

Yes, frontmatter is required for metadata in shadcn/ui presets. The system also supports optional scripts, references, and assets directives to guide the component installation and registry management process.