UI

@caisson/ui is the typed token floor. It ships a set of --cs-* custom properties in OKLCH, delivered as exactly two themes — one light, one dark. This docs site renders on those same tokens.

The contract

You re-skin by swapping token values, never by forking a component. A component reads a token; it never hard-codes a hex value, so a brand change is a set of new variables, not a patch across the component tree.

:root {
  --cs-bg: oklch(99% 0 0);
  --cs-fg: oklch(20% 0 0);
  --cs-accent: oklch(62% 0.19 256);
}

/* Re-skin = new values here. Components read the tokens; they never fork. */

Related