Skip to content

Contrast

Every colour pair Platform Code checks against WCAG 2.1 AA, for each component and for the docs site's own UI, in light and dark mode.

Version 0.2.0 ·

The token build fails if any pair below is under WCAG 2.1 AA, in light or dark mode: 4.5:1 for text, 3:1 for icons, borders that carry meaning and focus rings. Disabled states are exempt (WCAG 1.4.3). Each row is the lowest ratio across the surfaces that variant and state can sit on.

Component pages show the same data for one component, collapsed. Foundation pairs (text, icon and status tokens on page surfaces) are checked by the same build.

12 pairs, all passing. Text needs 4.5:1, icons and focus rings 3:1.

Variant / stateForeground on backgroundLightDark
initials / texttext-default / button-background-neutral-default16.44:1 AAA12.71:1 AAA
icon / iconicon-default / button-background-neutral-default16.44:1 3:112.71:1 3:1

Docs UI chrome

The docs site is built from the tokens it documents, so its own sidebar labels, tabs, table of contents, toolbar toggles, table columns and code blocks are audited too (the Docs UI chrome group above).