Typography

Guide index

One hierarchy, three renderings

Every surface shares the same information order: a stable title anchor, labels that precede values, metadata below headings, and explicit status wording beside any emphasis. Desktop and mobile are one graphical system: the same type families, roles, sizes and weights. Layout, padding, and component target dimensions adapt to touch and narrow screens; the type scale stays shared. The terminal expresses the same roles with one cell size, using bold, spacing, reserved marker cells and uppercase only for short tags.

None of the three platforms should imitate another's constraints. They share meaning, not pixels.

Families

Reading, labels, and controls use bundled Exo 2 (Exo 2, system-ui, sans-serif). Display titles use bundled Oxanium Bold (Oxanium, Exo 2, system-ui, sans-serif). Identifiers, code, and logs use bundled monospace with system fallbacks (Cascadia Mono, Consolas, ui-monospace, monospace). Use actual bundled weights only; do not synthesize bold or italic.

Desktop

Same families, fallbacks, and weight rules as above.

Mobile

Identical to desktop: same families, roles, sizes, weights and the full scale below. The only addition is that sizes also honor the host text scale (sp, Dynamic Type, or equivalent). Do not horizontally scale or add wide tracking to imitate wordmarks.

Terminal

The terminal owns font family, size and line height. One monospaced grid carries titles, borders, code and body copy. Use regular and bold weights only; avoid italic, faint text and ligatures.

Oxanium · display and titles

Validation overview

Exo 2 · reading and controls

Inputs verified; ready to submit when the operator confirms.

Run validation

Monospace · code and identifiers

job-042-revision-8

Graphical type scale

Sizes and line heights are logical pixels at 100% text scale on desktop. Mobile uses the same roles and values, additionally multiplied by the host scale. The terminal maps each role to weight, spacing or a compact tag at one size.

RoleFamily / weightSize / line heightUse
DisplayOxanium 70036 / 44Occasional product landing/overview title
Page titleOxanium 70028 / 36One main workspace title
Section/card titleOxanium 70022 / 28Major section and card heading
Small panel headingExo 2 60016 / 24Drawer and compact panel labels
BodyExo 2 40016 / 24Reading copy
Control/field labelExo 2 50016 / 24Buttons, tabs, field labels and menus
MetadataExo 2 40014 / 20Hints, timestamps and secondary context
Badge/table labelExo 2 60014 / 20Short status and column labels
Code/logMonospace 40014 / 20Editable code, diagnostic text and identifiers

Use sentence case with normal letter spacing. Uppercase is limited to short acronyms, log levels and compact terminal tags. Avoid 11–12px microtext; essential status uses at least the metadata role.

Display · 36 / 44

Oracle

Page title · 28 / 36

Validation run

Section title · 22 / 28

Evidence summary

Small panel heading · 16 / 24

On this page

Body · 16 / 24

Three checks observed complete.

Control label · 16 / 24

Run validation

Metadata · 14 / 20

Job 042 · Revision 8

ExportRun

Badge label · 14 / 20

✓ Ready

Code · 14 / 20

revision: 8

Text layout

Default readable prose measure is 65 characters, with an upper bound of about 80. Align labels and paragraphs to the leading edge. Heading first lines stay anchored to the component inset. The first row contains the title and at most one optional trailing status chip; remaining chips, metadata, then actions follow below with at least 8px separation between rows on every platform. Label-to-control spacing is 8px; control-to-hint spacing is 4px.

Desktop

Numerical table columns may align trailing with tabular figures. Long identifiers may wrap at safe boundaries with an explicit copy action. Single-line navigation may truncate only when the full label remains accessible.

Mobile

Same anchoring and spacing tokens; narrow widths wrap content downward, with actions always below chips and metadata and no change to type roles. Do not rely on hover-only truncation; show the full label or an explicit expand affordance.

Terminal

Measure display cells, not string length. Reserve marker cells and leave blanks when a glyph is absent. Wrap log and code content without inserting decorative glyphs into copied data.

Validation run for upstream dependency checks

✓ Ready

Job 042 · Revision 8

ExportRun

Request identity

armory://jobs/042/revisions/8/evidence-bundle

Copy preserves the exact value.

Copy identity

Language and scaling

Do not encode layout in a particular English label length. At 200% text zoom on desktop, wrap toolbars within the action section below chips and metadata before clipping. On mobile, switch layouts at narrow widths rather than shrinking type. Maintain semantic heading levels even when visual roles repeat.

Desktop

Implement web text in scalable units; large screens do not justify microtype.

Mobile

Native type follows user font scaling independently of control height; touch targets use layout tokens from layout and density.

Terminal

Prefer reflowing columns and stage lists over shrinking the cell grid. User font preferences and wide characters must not destroy alignment.

200% text zoom · toolbar wraps below title

Validation run

Run validationExportSettings