Circle UI

Get started

Set up the Circle registry once, then install components by name.

1. Add the registry

Add the Circle registry to `components.json` so installs work with names like @circle-ui/button, @blocks/cookie-consent, and @i18n/cookie-consent-copy.

{
  "$schema": "https://ui.shadcn.com/schema.json",
  "registries": {
    "@circle-ui": "https://registry.circle.health/circle-ui/{name}.json",
    "@blocks": "https://registry.circle.health/blocks/{name}.json",
    "@i18n": "https://registry.circle.health/i18n/{name}.json"
  }
}

2. Install the base once

This brings in Circle tokens and shared setup.

pnpm dlx shadcn@latest add @circle-ui/circle

3. Install components by name

Add only what you need.

pnpm dlx shadcn@latest add @circle-ui/button
pnpm dlx shadcn@latest add @blocks/cookie-consent
pnpm dlx shadcn@latest add @i18n/cookie-consent-copy

Fallback

If you cannot edit `components.json`, install directly from the raw JSON URL.

pnpm dlx shadcn@latest add https://registry.circle.health/circle-ui/button.json