Installing WebberUI

1. Direct URL (no setup)

Works immediately. 274 of the 375 components are free and need no credentials.

npx shadcn@latest add https://webberui.com/r/split-text.json

2. Namespace (shorter, needs one-time config)

Add the registry to components.json, then reference components by short name. Without this entry the CLI fails with Unknown registry "@webberui".

{
  "registries": {
    "@webberui": "https://webberui.com/r/{name}.json"
  }
}

npx shadcn@latest add @webberui/split-text

3. Pro items (101 components + 104 templates)

Pro items return 401 without credentials. Pass a license key as a Bearer token — the CLI expands ${WEBBERUI_KEY} from your environment, so the key itself never enters version control.

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

Signed in on the site, you can also copy a ready-to-run command with a short-lived token from any component page — see the setup guide (Traditional Chinese, but the commands are copy-paste) and pricing.

4. Machine-readable index

Every item, with a meta.tier of free or pro. Useful for directories, tooling and AI agents.

https://webberui.com/r/registry.json   # 479 items
https://webberui.com/llms.txt          # llmstxt.org site index

5. AI coding agents (MCP)

There is an MCP server that lets Claude Code, Cursor and Codex search components and fetch source without a components.json existing yet. Note that shadcn CLI 4.13+ ships its own MCP server which is more complete if you already have one — details in the MCP guide.

claude mcp add webberui -- npx -y @webberui/mcp