Cary · Style

Instrument, not interface.

The house style for MDClarity pages. Cool Pacific-Northwest neutrals, one fir accent, and a harmonized spectrum that carries the queer thread. Fraunces for display, a clean sans for reading, mono for every label and number. Flip the toggles above — every flavor and theme is the same tokens.

Foundations · 01

Type

Fraunces (display) sets headings tight and optical. Body is a neutral sans at a generous measure. Mono brands labels, metrics, and metadata — the single tic that makes a page read as ours and never as cream-essay.

display / h1Migration Scorecard
h2Ingestion shape & lineage
h3How a pipeline is read
bodyThe medallion model tracks every customer from bronze ingestion through gold production. Each tier is a checkable contract, not a vibe.
kickerData Foundation · Q2
mono142 customers · 38 live · 11 gold
Foundations · 02

Color

Neutrals are cool fog — desaturated, never warm cream. One fir accent is the brand constant across every flavor and theme. The spectrum is the variable: serene Salish Dusk in explainers, brighter Capitol Hill in dashboards (flip the toggle to watch it change).

Neutrals & accent

Paper
--paper
Panel-2
--panel-2
Line
--line
Dim
--dim
Ink
--ink
Accent · fir
--accent

Spectrum (the queer thread)

--s1
--s2
--s3
--s4
--s5
--s6
Foundations · 03

Components

The reusable kit from base.css — every page builds from these so the family stays recognizable.

Buttons
Tags & stages
RevFind gold dormant build test live done
Metric strip
142
Customers
38
Live
11
Gold
Pride hairline

The signature motif — a section rule, a hero top-border, a header underline.

Patterns · 04

Two flavors, one theme

Same primitives, two densities. The explainer reads; the dashboard packs. Toggle the flavor up top to flip this whole page — these samples change with it.

Explainer

Migration Scorecard

The medallion model tracks every customer from bronze ingestion through gold production.

142
Customers
38
Live
11
Gold
Dashboard · Commonwealth
Eligibility 837RFdone
Remit PostingCFlive
HL7 InboundRFbuild
s1 s2 s3 s4 s5 s6