MCP

Add Rare UI from Claude Code, Cursor, Codex, or VS Code. One registry in components.json, then ask for any component.

1Add the registry

In the project that already has shadcn, open components.json and add this. Leave {name} as written. Your app needs shadcn init first: components.json, Tailwind, and the cn helper.

{
  "registries": {
    "@rare-ui": "https://raw.githubusercontent.com/swamimalode07/rare-ui/main/public/r/{name}.json"
  }
}

2Turn on the shadcn MCP server

Run this in that same project, then restart the editor. In Claude Code, /mcp should list shadcn as connected. In Cursor, enable shadcn under MCP settings.

npx shadcn@latest mcp init --client claude

3Ask for a component

Name @rare-ui, or just ask in a sentence. A bare add fluid-orb looks in the default shadcn set, so that one is crossed out. The file lands in your components/ui folder. You own it after that.

add fluid-orb

add @rare-ui/fluid-orb

Add the fluid orb from Rare UI

Codex

Codex does not write its config for you. Add this to ~/.codex/config.toml, then restart Codex. The registries block in components.json is the same.

[mcp_servers.shadcn]
command = "npx"
args = ["shadcn@latest", "mcp"]

Without MCP

The CLI installs the same files. Browse every component on the components page.

npx shadcn@latest add swamimalode07/rare-ui/fluid-orb