Foundations

Every value below is read from wx-kit.css at runtime, not transcribed. Use the theme control in the topbar to check both surfaces.

Computed

Text roles

five voices, not nine sizes
RoleSpecimenSize WeightLineJob

Figure roles

tabular + lining, identical on every operating system
RoleSpecimenSizeJob
Why tabular matters

Every glyph advances the same width, so a column of amounts aligns on the decimal and a live value cannot shuffle sideways as it updates. The digits below are deliberately different in every row and must still form straight columns.

Rhythm

three, and a pair

Vertical space is the parent's job. A child does not know what follows it, so it cannot be the thing that decides the gap. Before this, 22 screens carried 383 inline style attributes encoding 27 different spacing values, five of which were not on the scale at all.

Spacing scale

Surfaces and text

Contrast, measured live
PairOn surface On raiseVerdict

Provenance

not brandable, not decorative
Computed Generated

Aqua means the deterministic plane computed it. Iris means the probabilistic plane generated it. The hue angles are identical in both themes — dark re-earns contrast by changing lightness only, because a compliance signal that shifts meaning between rendering modes is not a signal.

A generated sentence carries its mark as a rule down the left edge, so it needs no chip inline.

Controls

all 32px tall, so they align in a row
Neutral Active Pending Failed T1 T2 T3