Ansora UI

Ansora UI is not an npm component library. It is a shadcn registry: you install a component with the shadcn CLI and its source lands in your own project, under an ansora/ directory so it can never overwrite an upstream file. What makes it look like Ansora is not in the components but in the tokens (@ansora/tokens) — an upstream Card or Table installed straight from ui.shadcn.com already renders in the Ansora look.

Set up a projectCopy Anchor Link

Start from a fresh shadcn project (base = Base UI, preset nova), then install the base item first — it brings the tokens, the stylesheet lines and the setup notes every other item assumes:

pnpm dlx shadcn@4.23.0 init --base base --preset nova

Point components.json at the registry. It needs a token; ask for one and put it in .env.local as ANSORA_REGISTRY_TOKEN:

{
  "registries": {
    "@ansora": {
      "url": "https://ui-registry.ansora.vvy.dev/r/v1/{name}.json",
      "headers": { "Authorization": "Bearer ${ANSORA_REGISTRY_TOKEN}" }
    }
  }
}

pnpm dlx shadcn@4.23.0 add @ansora/base @ansora/conventions
pnpm dlx shadcn@4.23.0 add @ansora/status-pill

Read the base page before anything else: @ansora/tokens and @ansora/core are not on npm yet, and the two globals.css lines and the transpilePackages entry it describes are not optional.

What is hereCopy Anchor Link

• Components — every item in the registry, each with live examples. The examples are the same fixtures the release gate photographs and measures, rendered through the same route, so what you see here is what was checked.
• Colour and Density — the token values, read from packages/tokens/src/tokens.ts.
• Rules — the handful of rules that hold everywhere and what enforces each one.