Color Palette

OKLCH tonal ramps with perceptual normalization

Click any swatch to copy its valueDouble-click to enter comparison mode and check contrastHC = High-Chroma variants stacked at 500/600/700

Click to copy · Double-click to compare12 steps + HC variants at 500/600/700

Copy format:

Navy

#020C28

Green

#0B2B18

Red

#540B0E

Neutrals

Atmospheric

Color Theory

The physics and philosophy of the palette

The palette rejects digital neon in favor of Heritage Materials. Colors found in the leather, wool, and ink of 19th century institutions.

Ink

The deep blue-black of fountain pen ink on bond paper. Authority without coldness.

Cabinet

Baize-covered tables, leather-bound ledgers. Institutional permanence.

Seal

Wax seals, oxblood leather. Urgency with heritage weight.

Color Physics

Perceptual uniformity (OKLCH). Equal numerical changes produce equal perceived changes. No hue has unfair advantage.

Gamut normalized chroma. Each color uses its proportional maximum, ensuring visual balance across all hues.

Atmospheric neutrals. Grays carry a whisper of Navy (H=263°), never pure. Bond paper warmth, ink depth.

Three base colors anchor the entire system. Each is placed for cultural meaning, not mathematical harmony.

Navy

#020C28

H: 263°

Institutional blue with violet undertone. Shifted 5° from pure blue to create an inky quality that pairs with warm paper tones.

Green

#0B2B18

H: 145°

Cabinet and forest green. Historical association with institutional interiors. Reads as established rather than fresh.

Red

#540B0E

H: 25°

Oxblood/heritage crimson. Wax seals, leather, libraries. Serious urgency, not alarm.

All colors are defined in OKLCH, a perceptually uniform color space. This means equal numerical changes produce equal perceived changes.

OKLCH = (L, C, H)

L = Lightness

0.0 (black) to 1.0 (white)

Perceptually linear brightness

C = Chroma

0.0 (gray) to ~0.4 (max)

Saturation intensity

H = Hue

0° to 360°

Position on color wheel

Unlike HSL or HSV, OKLCH ensures that 50% lightness looks equally bright across all hues, and chroma values are consistent regardless of hue angle.

Every color in the system is calculated using a single formula that ensures perceptual harmony.

C = intensity(L) × boost(step) × C_max(H, L)

intensity(L)

A curve mapping lightness to desired saturation. Dark tones get full intensity; light tones fade to near-zero.

boost(step)

Per-step multiplier for emphasis. Steps 500-600-700 can receive a 1.5× boost for high-chroma variants.

C_max(H, L)

The physical gamut limit. Maximum chroma achievable for this specific hue at this lightness in sRGB.

Each base color generates 12 steps at fixed lightness values. Steps have semantic meanings.

Step	L	Usage
000	1.00	Pure white
050	0.98	Bond (page backgrounds)
100	0.95	Wash (secondary backgrounds)
200	0.85	Surface (cards, inputs)
300	0.75	Border (dividers, hairlines)
400	0.60	Disabled (placeholders)
500	0.50	Neutral (transition zone)
600	0.40	Secondary (sub-headers, icons)
700	0.30	Primary (body text, borders)
800	0.20	Strong (headlines)
900	0.10	Anchor (high-impact backgrounds)
950	0.05	Ink (off-black text)

Steps 500, 600, 700 (highlighted) are the primary functional range. High chroma variants apply 1.5× boost to these steps only.

Pure grays feel sterile. Atmospheric neutrals carry a hint of the anchor hue (Navy at 263°), creating visual cohesion across the system.

Bond

L: 0.98 | C: 0.003 | H: 263°

Page backgrounds, paper simulation. A whisper of Navy creates warmth.

Ink

L: 0.15 | C: 0.008 | H: 263°

Off-black text, deep shadows. Slight Navy undertone prevents harshness.

Mathematical color harmony (triadic, complementary) produces balanced but generic results. These colors are placed for cultural meaning, not geometric purity.

HARMONY DEVIATION FROM PERFECT TRIAD

263°

Navy (anchor)

145°

+122° from ideal

25°

+122° from ideal

A perfect triad from 263° would give orange-yellow and teal. Neither carries the institutional weight we require. The high deviation (~122° average) confirms these are intentional brand decisions.