@clinia/tailwindcss
Clinia's brand tokens for Tailwind CSS v4: the colour palette, the light and dark theme as semantic tokens (bg-primary, text-muted-foreground, border-emphasis), the type scale, the radius scale, and the brand font faces.
Components come from the @clinia shadcn registry, not from this package. Documentation, rules, and components: ui.clinia.dev.
Install
The theme registry item installs this package and writes the imports for you:
pnpm dlx shadcn@latest add @clinia/theme # product apps
pnpm dlx shadcn@latest add @clinia/theme-marketing # marketing sites
To install it by hand:
pnpm add @clinia/tailwindcss
@import "@clinia/tailwindcss/fonts";
@import "@clinia/tailwindcss";
Entry points
| Import | What it adds |
|---|---|
@clinia/tailwindcss | The theme: semantic tokens for light and dark, exposed to Tailwind |
@clinia/tailwindcss/tokens | The raw brand palette and font stacks only |
@clinia/tailwindcss/fonts | The @font-face declarations for the seven licensed faces |
@clinia/tailwindcss/marketing | The illustration roles for marketing scenes. Marketing sites only |
@clinia/tailwindcss/fumadocs | Fumadocs' colour tokens and states from Clinia's theme, for documentation sites on fumadocs-ui |
Dark mode follows a dark class on <html> or any ancestor; light pins a subtree back to light.
Fonts
The package declares the brand faces but ships no font files: CircularXX and NaN Serf B are licensed per property and can't be redistributed. Put the seven .woff2 files in your app's public/fonts/: App getting started lists them and where to get them.
Licence
MIT. The brand fonts are not part of this licence.