skills.rest
SensLiao
SensLiaoCOMMUNITY
Explore all skills by this author →
GitHub

shadcn-registry

Package and distribute self-hosted component libraries via JSON-over-HTTP.

Updated May 28, 2026
Search Tags:#design system#self-hosted#component registry#UI component sharing#design token integration
One-click install
npx skills add https://github.com/SensLiao/Claude-code-setting --skill shadcn-registry-sensliao
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: shadcn-registry
Source: https://github.com/SensLiao/Claude-code-setting/tree/main/skills/shadcn-registry
Command: npx skills add https://github.com/SensLiao/Claude-code-setting --skill shadcn-registry-sensliao

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill allows you to create a self-hosted component registry for your design system, enabling you to easily reuse components across projects and maintain a consistent UI across your applications.

Core Features & Use Cases

  • Self-Hosted Registry: Create a private registry for your components and share it across your projects.
  • Component Reuse: Reuse components, blocks, hooks, and tokens across different projects.
  • Design System Integration: Wire the registry's CSS variables to your design-token-pipeline outputs for consistent theming.
  • Use Case: If you want to share a component library or a design system across multiple projects, this Skill can help you automate the distribution and installation of your components.

Quick Start

Run 'shadcn init' in your project directory to set up the component registry. Author your components and use 'shadcn build' to package them for distribution. Then, use 'shadcn add <url>' to install components from your registry.

Frequently Asked Questions about shadcn-registry

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

FAQPage Schema
How do I create a self-hosted component registry for my design system?▼

A self-hosted component registry lets you privately distribute UI components across projects. You build and install these components using CLI tooling and JSON-over-HTTP, requiring local component hosting for your team.

How do I share UI components across multiple projects without publishing them publicly?▼

You can share UI components privately by setting up a self-hosted component registry using CLI tooling, packaging components with 'shadcn build', and installing them via 'shadcn add <url>' across different projects.

Can I wire my design token pipeline outputs into a component registry for consistent theming?▼

Yes, you can wire the registry's CSS variables directly to your design-token-pipeline outputs. This integration ensures consistent theming across all applications that consume components from your self-hosted registry.

Does setting up a private component registry require local hosting and CLI tooling?▼

Setting up a private component registry does require local component hosting and CLI tooling. You use the CLI to build packages and install components from your registry into target projects.

What is the best way to distribute reusable hooks and blocks across different applications?▼

The best way to distribute reusable hooks and blocks is through a self-hosted component registry. This approach automates distribution and installation via CLI commands, ensuring consistent UI across multiple applications.

What do I need to host locally to share a component library across projects?▼

You need to host your component library locally to share it across projects. This local hosting supports the JSON-over-HTTP distribution mechanism used by the CLI tooling to install components.

Related Skills

Explore More Software Engineering Skills→
Benmore-StudioBenmore-Studio
1

stripe-projects

Provision Stripe Projects stacks and bootstrap the Projects CLI for new apps.

Official
Intermediate
jubalmjubalm
1

shadcn/ui Customization & Theming

Configure CSS variable-based theming for shadcn/ui components with Tailwind.

Community
Advanced
dylantarredylantarre
38

design-tokens-structure

Structures design tokens into a 3-layer system for theming and governance.

Community
Basic
jia-wei-00jia-wei-00

gluestack-ui-v4

Organize Gluestack UI v4 design-pattern guidance across Expo/React Native and Web projects.

Community
Advanced