Foundations

Typography and data formats

Six sizes and no seventh. Words are set in Inter; numbers people compare down a column are set in the data face.

The type scale

Style	Size	Sample	Use
Display / Cover	52px	Weld fixture	Cover pages, marketing
Display / Headline	38px	Weld fixture	Page heroes
Section Header	18px	Weld fixture	View and section headers
Label & Body	13px	Weld fixture	Body copy, labels, buttons
Table & Input	12px	Weld fixture	Cells, fields, pills, hints
Dense Header	10px	Due date	Data-grid column heads only

The one 10px tier

10px uppercase on the dense tracking is a column head and nothing else. Labels, hints, values and pills are 12px. Gate C10 fails 10px anywhere outside a column head.

VendorGulf Coast Steel · net 30

Do: keep 10px for the column head and set every label, value and pill at 12px.

Avoid

VendorGulf Coast Steel · net 30Last ordered 3 weeks ago

Avoid: dropping a drawer to 10px to fit more in. It stays on the scale and still reads as unusably small.

Data formats

The data face (JetBrains Mono, through --font-mono-data) is for numbers, timestamps, currency and part serials, where a reader compares digits down a column. It never sets a sentence.

Kind	Example	Rule
Quantity	24	Data face, tabular figures, right aligned in a column
Currency	$1,284.50	Data face, two decimals, symbol leading
Timestamp	09 Oct 2026, 14:05	Data face; day before month, 24-hour
Part serial	JF0004	Data face; never truncated
Count in a chip	3/24 rcvd	Inter with tabular figures, not the data face
No value	-	A hyphen in muted text, or nothing

PO PO-3514215 arrives Friday with 24 of 24 lines.

Do: set the sentence in Inter and only the identifier in the data face.

Avoid

PO PO-3514215 arrives Friday with 24 of 24 lines.

Avoid: monospace in continuous prose. It slows reading and hides the one value that matters.

Punctuation

No em dashes in anything the app writes: labels, hints, toasts, empty states or cells. Use a colon, a comma, parentheses or a full stop. An empty cell shows a hyphen in muted text.

ASME B16.9 (A234 WPB), not a dash between the two.
Damaged: batch quarantined.
Text the app only displays, like a vendor description, is data: it can be normalised for display but is never rewritten.

More in Foundations and concepts

Design principlesFour human commitments for software on a shop floor, and the engineering rule that keeps each one.Token architecture and tiersPrimitive, semantic and component tokens, and how one value cascades to a control.Color and the monotonic ladderSix charcoal rungs measured in L*, text contrast, and status hues that name conditions.Data visualization and charts20 chart archetypes at three sizes, timeline rules, the series colour contract, and accessible charts.Layout patterns and shell slotsThe five shell slots, drawer anatomy, and density that steps inward.Light theme architectureWhy light mode is not an inverted ladder, the chrome hover fix, and the contrast math.