shadcn CLI

Every component, block, example and illustration in Shadcn UI Kit is available in a shadcn registry named @shadcnuikit. You install items with the regular shadcn CLI, and the files land in your project like any other shadcn/ui component.

1. Add the registry

Add the registry to the registries field of your components.json:

"registries": {
  "@shadcnuikit": {
    "url": "https://shadcnuikit.com/r/{name}.json",
    "headers": {
      "Authorization": "Bearer ${REGISTRY_TOKEN}"
    }
  }
}

Free items install without a token. Premium items need an API key.

2. Create an API key

  1. Open API Keys in your account. It is available on the Pro, Team and Enterprise plans, and to members of a team.
  2. Click Add API Key, give it a name and an optional expiry date. You can keep up to 4 keys.
  3. Copy the key and add it to your .env file:
REGISTRY_TOKEN=your_api_key

Keep the key out of version control. The same key also connects the MCP Server.

3. Install items

Use the registry name shown in the Get the Code dialog of each item:

npx shadcn@latest add @shadcnuikit/hero1

The same command works with every package manager:

pnpm dlx shadcn@latest add @shadcnuikit/hero1
yarn dlx shadcn@latest add @shadcnuikit/hero1
bunx --bun shadcn@latest add @shadcnuikit/hero1

Troubleshooting

  • Authentication error: the item is premium and the request had no valid key. Check that REGISTRY_TOKEN is set in .env and that the header is in components.json.
  • Missing imports after install: some items use extra packages such as recharts, motion or @tanstack/react-table, or other shadcn/ui components. Install them with your package manager or npx shadcn@latest add <component>.
License & AccessMCP Server