Avatar

Updated 2026-05-19

Overview Content Accessibility Code

Accessibility

• Color & Contrast
  Check Ratio -------------- Body text (< 18pt) 4.5:1 minimum Large text (≥ 18pt or 14pt bold) 3:1 minimum UI components, icons, focus indicators 3:1 minimum Rules: - Use accessible color palettes and t
  status colors must have a non-color cue (icon, label, pattern)
• Typography & Readability
  - Default body text size is 14px - Minimum body text size is 12px - 11px is only acceptable for non-essential UI - Use defined type styles (avoid light weight) - Maintain readable line height and spac
• Layout & Responsiveness WCAG 2.5.8
  - Content reflows at 400% zoom - No horizontal scrolling for text content - Logical reading and focus order preserved - Touch targets: 44px ideal / 24px minimum with sufficient spacing (WCAG 2.5.8) -
  tables and graphs must reflow or scroll horizontally; never clip
• ARIA Guidance
  - Visible Labels: Every interactive element has a visible text label. - Label Persistence: Labels remain visible when the field is focused or filled (no placeholder-only labels). - The 1:1 Rule: The a
  tables use thead/tbody/scope; charts expose data tables for screen readers
• Keyboard & Focus
  - All interactive elements are keyboard accessible - No keyboard traps - Logical focus order - Use Tab for forward and Shift+Tab for backward - Only focusable items that are visually visible should be

Cross-cutting accessibility

See the full WCAG 2.2 AA guidance for criteria that apply to every component.