@ockham-sh/brand

Canonical Tier-1 brand primitives for the Ockham ecosystem — colors, type scale, font families. One source (src/tokens.json), generated into every format the consumers need. This is the thing that stops the brand drifting across repos.

Brand architecture, the full rationale, and the migration plan live in the workspace at _planning/PLAN-brand-token-alignment.md.

The two brands

| Brand | Covers | Core | |---|---|---| | parsimony* | the whole framework family (parsimony, parsimony-agents, parsimony-connectors, …) | sandstone #A8987E | | Ockham | the product (terminal) | steel-blue #6082B6 |

All parsimony-* repos share one color — differentiate by wordmark, never hue. core is the brand; bright / deep / shade / on are the UI-state ramp.

What it emits

npm run build reads src/tokens.json and writes:

| Output | For | |---|---| | dist/tokens.css | CSS custom properties — every color as hex + -hsl + -rgb (space) + -rgb-csv (comma), plus the type scale | | dist/tokens.ts | typed constants for JS/TS | | dist/tailwind-preset.ts | theme.extend fragment (colors + fontFamily + fontSize) | | dist/fonts.css | @font-face for the self-hosted families | | assets/badge-colors.json | bare hexes for README shields.io badges |

The four color forms exist so every consumer convention works from one source: hsl(var(--brand-ockham-core-hsl)) (shadcn/terminal), rgb(var(--…-rgb) / α) (modern), rgba(var(--…-rgb-csv), α) (legacy/landing).

Consume it

// CSS — import once at the app entry
import "@ockham-sh/brand/tokens.css";
import "@ockham-sh/brand/fonts.css";

// Tailwind
import { ockhamBrand } from "@ockham-sh/brand/tailwind-preset";
export default { presets: [ockhamBrand], /* … */ };

// JS/canvas (values that can't read CSS vars)
import { color } from "@ockham-sh/brand";
const blue = color.ockham.core; // "#6082B6"

Apps alias these primitives into their own semantic tokens (Tier 2) — they do not consume --brand-* directly in components. See the PLAN doc for the per-repo mapping.

Preview

Open preview.html (styled entirely by the generated dist/tokens.css) for the full showcase: ramps, the three/four color forms, type scale, and in-use examples.

Editing the brand

1. Edit src/tokens.json (only place you hand-edit).
2. npm run build.
3. Bump version, publish (npm publish — runs the build via prepublishOnly).
4. Bump the @ockham-sh/brand pin in external consumers (e.g. terminal/web). Workspace consumers (@ockham/ui) pick it up automatically.