Web Dev Tools

Accessibility Testing

Catching a11y issues during dev, CI, and in production.

Automated testing engines

  • axe-core — Deque's a11y engine; the foundation for most other tools. The default automated checker.
  • HTML CodeSniffer — older, complementary findings to axe.
  • WAVE Engine — also long-running.

Wrappers / integrations

  • @axe-core/playwright — Playwright integration; run a11y assertions as test steps.
  • jest-axe / vitest-axe — assert axe findings inside unit / component tests.
  • @axe-core/react — runtime axe in dev mode; surfaces issues in the console.
  • Storybook Accessibility addon — runs axe in every Storybook story.
  • Cypress-axe — Cypress integration.

Lint-time

  • eslint-plugin-jsx-a11y — React-specific lint rules; ships in eslint-config-next.
  • eslint-plugin-vuejs-accessibility — Vue equivalent.
  • @nx/eslint-plugin accessibility presets — enterprise.

CI / page-level audits

  • Lighthouse CI — Chromium-based audit, accessibility score + Core Web Vitals + SEO.
  • Pa11y + Pa11y CI — sitemap-driven a11y audits.
  • Axe DevTools CLI — Deque's hosted CLI runner.
  • Webhint — Microsoft's hint engine.

Browser extensions / manual

  • axe DevTools — Chrome / Firefox extension.
  • Accessibility Insights for Web (Microsoft) — guided assessments.
  • Stark — design-time + runtime; freemium.
  • WAVE — browser extension.
  • VoiceOver / NVDA / JAWS — actual screen readers; nothing replaces using them.

Components designed for a11y

  • React Aria / React Aria Components — Adobe's accessible primitives; arguably the strongest a11y story in any framework.
  • Radix UI — accessible by default.
  • Ark UI / Headless UI / Reach UI — a11y-first.

Color contrast specifically

  • APCA (advanced perceptual contrast) — successor to WCAG 2.x contrast; libraries like apca-w3 and built-in to culori.
  • Stark Contrast Checker — browser extension.
  • @adobe/leonardo — palette generation with contrast targets.

Pick this if…

  • Default in CI: axe in Playwright + Lighthouse CI.
  • Catch regressions during dev: @axe-core/react + Storybook a11y addon.
  • Lint at write-time: eslint-plugin-jsx-a11y.
  • Need an accessible component foundation: React Aria Components or Radix.
  • Manual audit: axe DevTools + screen reader (VoiceOver / NVDA).

On this page