Theming

A Style ships two things: component source, and the default Token values that source assumes. init writes the Token block into your CSS entry, and every kosori component reads colours, radii and typography from it.

Where the Tokens landCopy Anchor Link

init merges the Style's block into the CSS file named in components.json, once under :root and once under .dark. Change a value there and every component follows — no component source is touched.

Base colorCopy Anchor Link

The Base color is the palette behind the colour Tokens. zen proposes neutral; mauve, mist, olive, stone, taupe and zinc are the others. Choose one by naming it in the preset URL:

npx shadcn@latest init --base base --preset https://kosori.codingcodax.dev/init/zen/zinc

Every palette value is written from the preset, so the values the CLI fetches from shadcn's host are discarded. The CLI still makes that request, so setup needs network access to shadcn's host — the in-repo copy removes the dependency on the returned values, not on the host.

RadiusCopy Anchor Link

Every corner comes from one Token, --radius. The Style's @theme inline block derives --radius-sm through --radius-4xl from it, so changing --radius reshapes every component at once.

Typography is yoursCopy Anchor Link

kosori ships no font. The Style sets --font-sans and --font-mono to a plain system stack, and an install never writes to your layout or route files — the two parts of a project kosori understands least.

That leaves the typeface to you. Point --font-sans at your own font where you set up your layout — a licensed face, a self-hosted file or a webfont are all your call — and every component picks it up. This documentation site does exactly that with a local font of its own.