Accessibility

WCAG 2.2 AA

STYLE-A11Y-001 — Visible focus

Interactive controls expose a visible focus treatment.

STYLE-A11Y-002 — Button contrast

Primary button text/background contrast is at least 4.5:1.

STYLE-A11Y-003 — Programmatic labels

Inputs have programmatically associated labels.

STYLE-A11Y-006 — Invalid input feedback

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.

STYLE-A11Y-009 — Button target size

Buttons declare a minimum target of at least 40px in both dimensions. This is a product rule, not a claim that WCAG requires 40px.

STYLE-A11Y-010 — Button focus ring contrast

A button's mapped focus ring color has at least 3:1 contrast against the primary surface. Check other adjacent surfaces in rendered use.

STYLE-A11Y-011 — Dialog accessible name

A dialog is programmatically named by its visible title.

STYLE-A11Y-012 — Dialog focus management

Opening a dialog moves focus inside it, keeps focus inside while open, and returns focus to its trigger on close.

STYLE-A11Y-013 — Dialog Escape dismissal

Escape closes a dialog when dismissal is allowed. Any non-dismissible exception must be explicit in the implementation.

Required contrast pairs

RuleForegroundBackgroundMinimum
STYLE-A11Y-002semantic.action.primary.foregroundsemantic.action.primary.background4.5:1
STYLE-A11Y-004semantic.text.primarysemantic.surface.primary4.5:1
STYLE-A11Y-005semantic.text.secondarysemantic.surface.primary4.5:1
STYLE-A11Y-007semantic.text.dangersemantic.surface.primary4.5:1
STYLE-A11Y-008semantic.border.dangersemantic.surface.primary3:1