shadcn

Manage shadcn/ui components and presets via CLI workflows.

3|3|Updated Jun 1, 2026

Search Tags:#workflow #ui #components #cli #shadcn #preset

Ready to run

npx skills add https://github.com/lawalletio/lawallet-nwc --skill shadcn-lawalletio

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: shadcn
Source: https://github.com/lawalletio/lawallet-nwc/tree/main/.agents/skills/shadcn
Command: npx skills add https://github.com/lawalletio/lawallet-nwc --skill shadcn-lawalletio

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill streamlines the setup, configuration, and ongoing management of shadcn/ui components and presets across projects, reducing boilerplate and ensuring consistent UI patterns.

Core Features & Use Cases

Scaffolds new projects with a selected preset using npx shadcn@latest init
Switches presets and applies updates across existing components to maintain consistency
Inspects registries, docs, and component metadata via CLI commands (init, apply, add, docs, info)
Derives configuration from components.json and registries to keep projects in sync

Quick Start

Choose a preset and apply it to your project with npx shadcn@latest init, then manage components with npx shadcn@latest add and documentation with npx shadcn@latest docs as needed.

Frequently Asked Questions about shadcn

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

FAQPage Schema

How do I add shadcn/ui components to an existing Next.js project?▼

To add shadcn/ui components, run npx shadcn@latest add to fetch and install specific UI elements from the registry directly into your project structure. This ensures consistent UI patterns by managing components through the CLI.

What is the best way to scaffold a new app with a specific shadcn preset?▼

Scaffolding a new app with a shadcn preset requires running npx shadcn@latest init. This initializes the project configuration, applies your selected preset, and generates the necessary components.json file for ongoing component management.

How does switching shadcn presets affect existing UI components?▼

Switching shadcn presets applies updates across existing UI components to maintain consistency. It derives configuration from registries and components.json, ensuring your current UI elements sync with the newly selected preset patterns.

Can I inspect shadcn component documentation and metadata without leaving the CLI?▼

Yes, you can inspect shadcn component documentation and metadata directly via the CLI using npx shadcn@latest docs and npx shadcn@latest info commands. These orchestrate registry data to display component details and configuration info.

Do I need a components.json file to manage shadcn/ui components across projects?▼

Yes, a components.json file is required to manage shadcn/ui components across projects. The CLI derives project context and registry configuration from this file to keep your UI components in sync during updates and preset switches.

Why does shadcn/ui CLI orchestration matter for managing UI patterns?▼

shadcn/ui CLI orchestration matters because it streamlines setup and configuration across projects, reducing boilerplate. It ensures consistent UI patterns by managing workflows like init, apply, and add directly from component registries.