Accessibility
WCAG 2.2 AA
Interactive controls expose a visible focus treatment.
Primary button text/background contrast is at least 4.5:1.
Inputs have programmatically associated labels.
Automatically detected input errors identify the affected field in visible text, describe the needed correction, and are programmatically associated with the control. Invalid styling preserves visible focus.
Buttons declare a minimum target of at least 40px in both dimensions. This is a product rule, not a claim that WCAG requires 40px.
A button's mapped focus ring color has at least 3:1 contrast against the primary surface. Check other adjacent surfaces in rendered use.
A dialog is programmatically named by its visible title.
Opening a dialog moves focus inside it, keeps focus inside while open, and returns focus to its trigger on close.
Escape closes a dialog when dismissal is allowed. Any non-dismissible exception must be explicit in the implementation.
Required contrast pairs
| Rule | Foreground | Background | Minimum |
|---|---|---|---|
| STYLE-A11Y-002 | semantic.action.primary.foreground | semantic.action.primary.background | 4.5:1 |
| STYLE-A11Y-004 | semantic.text.primary | semantic.surface.primary | 4.5:1 |
| STYLE-A11Y-005 | semantic.text.secondary | semantic.surface.primary | 4.5:1 |
| STYLE-A11Y-007 | semantic.text.danger | semantic.surface.primary | 4.5:1 |
| STYLE-A11Y-008 | semantic.border.danger | semantic.surface.primary | 3:1 |