Skip to main content

Search rules

Search all UI Guides rules by name, category, or source

designimpeccable

Never #000, Never #fff

NEVER

NEVER: Ship `#000`, `#fff`, or zero-chroma grays like `#808080` — tint every neutral toward the brand's hue at OKLCH chroma ~0.005–0.015, letting chroma fall toward 0 as lightness approaches 0 or 100. Use the actual brand hue, not a reflexive warm-orange or cool-blue.

Tint every neutral toward the brand hue instead of shipping pure black, pure white, and dead grays

--surface: oklch(0.98 0.008 265);
--ink: oklch(0.18 0.01 265);

Bad

Good

Why it matters

The target is OKLCH chroma between roughly 0.005 and 0.015 at the brand's hue: small enough that nobody would call the surface "tinted", large enough to produce a subconscious sense that the neutrals and the brand color belong to one system. Pure #000, #fff, and #808080 have zero chroma, so they have no hue relationship to anything you ship and read as detached.

Two lazy reflexes to avoid: tinting everything warm-orange, or everything cool-blue, regardless of what the brand actually is — the hue must be the brand's. Chroma must also fall toward zero as lightness approaches 0 or 100, otherwise the near-white and near-black ends start to look visibly colored rather than quietly cohesive.

Built by Gleb Stroganov, design engineer at Evil Martians.

The rules come from other people's skills and guidelines — Vercel, Rauno Freiberg, @Ibelick, impeccable, Emil Kowalski, Tailwind, RAMS — each one credited on the Sources page. The work here is extraction and wiring: every rule is pulled into one corpus, given a good and a bad example you can operate, a MUST/SHOULD/NEVER rule an agent can paste, and a link back to where it came from.