Standards
| Standard | How it is enforced |
|---|---|
| Text has 4.5:1 contrast with its background (WCAG 2.2, 1.4.3) | Verified during the token build. Placeholder text is held to the same 4.5:1 threshold |
| Control boundaries and focus indicators have 3:1 (1.4.11) | Field borders and the focus ring color have dedicated tokens included in the contrast check |
| Color is never the only signal (1.4.1) | Badges carry text labels and banners use distinct mark shapes per tone. Invalid fields combine a thicker border with an error message |
| A pressable area is at least 24px (2.5.8); touch follows iOS 44pt and Android 48dp | Size tokens are separated by input device. Touch uses 48, satisfying both platform guidelines |
| A focus indicator is at least 2px thick (2.4.13) | Focus ring width and offset are defined as tokens |
| People can enlarge text (1.4.4) | Mobile respects the system text size setting, and controls set a minimum height rather than a fixed height |
| Reduced-motion settings are respected | When reduced motion is active, the spinner pulses slowly instead of rotating, and presses, switches, and sheets change state without animating. The Compose desktop app is the exception, since the JVM cannot read the OS setting |
The three-tier token structure follows the same model used in Material Design 3 (reference, system, component) and GitHub Primer (base, functional, component).