$axe-core --scan ./ --level AAA↳ 6/6 rules · live
A11y
first.
Lerpa UI ships with axe-core baked into the test suite. Every component passes WCAG 2.1 AA and most reach AAA. These are the rules the agent enforces on every PR.
✓
Strict WCAG 2.1 AA & AAA contrast compliance (4.5:1 ratio minimum)
✓
Full keyboard focus navigation (Tab / Shift+Tab / ArrowKeys) on all interactives
✓
Explicit ARIA labels (aria-expanded, aria-describedby, aria-hidden)
✓
Focus rings preserved — never removed via outline:none without replacement
✓
Semantic elements: <button> not <div onClick>; <nav>/<main>/<aside> landmarks
✓
Reduced-motion gating via usePrefersReducedMotion across every animated component
— motionReduced motion baked in
Every animated primitive checks usePrefersReducedMotion. Set the OS flag, the motion stops — no flicker, no rebuild.
— keyboardKeyboard-first
Roving focus, Esc-to-close, ⌘K wired in dropdowns / dialogs / command palettes. Tested in axe-core + vitest-axe.
— contrastAAA contrast
Token palette tuned for ≥4.5:1 on body, ≥3:1 on UI chrome. Every theme variant verified.