MCP

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

  1. 1

    Add the registry

    Your project needs shadcn set up first: components.json, Tailwind, and the cn helper. Add this to components.json and keep {name} as written.

    {
      "registries": {
        "@pixel-ui": "https://raw.githubusercontent.com/ikislay/pixel-ui/main/public/r/{name}.json"
      }
    }
  2. 2

    Connect your editor

    Run this in your project, then restart Claude Code. /mcp should list shadcn as connected.

    npx shadcn@latest mcp init --client claude
  3. 3

    Ask for a component

    Prefix the name with @pixel-ui, or ask in plain words. The file lands in components/ui, and it's yours from there.

    Works
    add @pixel-ui/toast
    Add the toast from Pixel UI
    Won't find it
    add toastsearches the default shadcn registry

Without MCP

The shadcn CLI installs the same files. Browse everything on the components page.

npx shadcn@latest add ikislay/pixel-ui/toast