Cobalt
Clean enterprise blue — high-contrast cobalt on white, structured and precise for developer platforms and corporate SaaS, with documentation treated as first-class product UI.
Version 1.0.0Meet Cobalt
A look at its colors and typography, from the headline to the smallest details.
A place for your next chapter.
Your ideas, your stories, your point of view. Give them a home that feels like you.
Thoughtful type, a clear palette, and space for what matters.
A place for your next chapter.
Your ideas, your stories, your point of view. Give them a home that feels like you.
Thoughtful type, a clear palette, and space for what matters.
The identity
A character of its own
Cobalt is the reliable enterprise-blue workhorse: a white canvas, near-black slate text, and one decisive cobalt-blue accent (#1d4ed8) that carries every primary action and rule. It is opinionated enough to feel designed and familiar enough to never alienate an enterprise buyer — and it treats documentation as a first-class product surface, not an afterthought.
- precise
- structured
- high-contrast
- engineering-grade
The palette
Color with intention
Light palette
#ffffff#0f172a#1d4ed8#dbeafe#f1f5f9Dark palette
#0b1220#e8edf6#3568de#1b2942#141d2eThe typography
Find your voice in type
Headings
Make a little room for possibility.
-apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", sans-serifBody
Good stories start with a clear point of view.
-apple-system, BlinkMacSystemFont, "Segoe UI", "Inter", sans-serifCode & details
Aa Bb Cc · 0123456789
"SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospaceMade for
Who it speaks to
Developer-platform, corporate-SaaS, and internal-tooling teams whose sites are documentation-heavy: API references, product docs, changelogs, and technical marketing. Buyers are engineers, technical PMs, and procurement-minded decision-makers who trust clarity and structure over ornament.
The voice
How it sounds
Direct, technical, and confident without hype. Prefer precise nouns over adjectives, imperative verbs in CTAs ("Read the API reference", "Start the tutorial"), and concrete numbers over claims. Explain, don't sell; the confidence is in the specificity.
Art direction
The thinking behind the look
Pure-white (#ffffff) canvas with near-black slate text (#0f172a) and a single saturated cobalt (#1d4ed8) reserved for decisive moments: primary buttons, links, focus rings, and the recurring cobalt-rule motif (a 3px link-tinted top border that launchpad, panel, product-header, guide, and assist-card all share). System sans throughout — no serif, no webfonts — at a tight 1.15 heading rhythm and 1.625 body rhythm on a 16px base. Slate-blue borders (#e2e8f0), a #dbeafe emphasis wash, 0.5rem mid-radius surfaces, and a crisp 1px/8% shadow scale keep everything looking like precise product UI. In dark mode the same system goes to a cool slate-navy night (#0b1220 canvas, #e8edf6 text, #7aa2f7 links) — a blue-tinted dark, never a neutral black.