Clinia UI

What is the Registry?

The Clinia registry is a JSON-based distribution mechanism compatible with the shadcn CLI. It is hosted at:

https://ui.clinia.dev/r

When you run pnpm dlx shadcn@latest init or pnpm dlx shadcn@latest add, the CLI fetches a JSON file from this URL, reads the list of files, dependencies, and configuration actions it contains, and applies them to your project. You never install a component library — you receive source code that lives in your own repository.

The registry is generated from a registry.json file in the apps/web directory using shadcn build, which writes the output to apps/web/public/r/.

Registry Items

There are two registry items in Clinia UI. Components themselves are installed via the standard shadcn CLI — only the base configuration and theme layer live in the Clinia registry.

registry:basebase.json

URL: https://ui.clinia.dev/r/base.json

Installed via:

pnpm dlx shadcn@latest init https://ui.clinia.dev/r/base.json

Its purpose is to configure your components.json file. It sets two important fields:

{
  "style": "base-maia",
  "iconLibrary": "hugeicons"
}
  • style: "base-maia" tells the CLI which variant of components to install. The base-maia style selects the Base UI component variant used by Clinia UI.
  • iconLibrary: "hugeicons" sets HugeIcons as the default icon set used in component templates. This is only a default — apps are free to use lucide or another richer icon library. Clinia ships no custom product icons and none are planned.

The registry:base type is a special shadcn type — it does not install files into your project, it only mutates configuration.

registry:themetheme.json

URL: https://ui.clinia.dev/r/theme.json

This item installs the design token layer. Running:

pnpm dlx shadcn@latest add @clinia/theme

does two things:

  1. Adds @clinia/tailwindcss to your project's dependencies
  2. Writes (or updates) globals.css to include the theme import:
@import "@clinia/tailwindcss";

The @clinia/tailwindcss package contains all CSS custom property declarations for colors, typography scale, spacing, border radii, and shadows. It also includes @theme inline blocks that bridge every token into Tailwind utility classes.

How the Registry is Built

The source of truth for the registry lives in apps/web/registry.json. Each entry in that file describes a registry item: its name, type, files, dependencies, and any components.json overrides.

Running the build command generates the public output:

pnpm shadcn build

This writes one JSON file per registry item into apps/web/public/r/. The Next.js app serves these as static files, making them accessible at https://ui.clinia.dev/r/<name>.json.

A simplified registry:theme entry looks like this:

{
  "name": "theme",
  "type": "registry:theme",
  "dependencies": ["@clinia/tailwindcss"],
  "cssVars": {},
  "files": [
    {
      "path": "registry/theme/theme.css",
      "type": "registry:theme"
    }
  ]
}

Using the @clinia Namespace

Running shadcn init with the Clinia base URL automatically registers the @clinia namespace in your components.json:

{
  "registries": {
    "@clinia": {
      "url": "https://ui.clinia.dev/r/{name}.json"
    }
  }
}

With this in place, you can install Clinia registry items using the @clinia/ prefix without specifying the full URL each time:

pnpm dlx shadcn@latest add @clinia/theme

All other components are installed directly from the default shadcn registry:

pnpm dlx shadcn@latest add button card input