Web Tools tools.bryantsmith.com

Accessibility

WCAG Contrast Batch Checker

Paste two palettes and test every foreground/background pairing at once. Each cell shows the real WCAG contrast ratio and whether it passes your chosen level — completely in your browser, so your colors never leave the page.

Runs in your browser WCAG 2.1 v1.0.0

Palettes

one color per line

Accepts hex, rgb(), hsl() and CSS color names. Blank lines and duplicate colors are ignored; unrecognized colors are listed below. Transparency is composited before measuring.

Results

AA normal text
0 pass
0 fail
0 combinations
— of pairs pass

How it works

Every foreground color is measured against every background color using the WCAG 2.1 contrast formula (L1 + 0.05) / (L2 + 0.05). Normal text needs 4.5:1 for AA and 7:1 for AAA; large text (18pt, or 14pt bold) needs 3:1 for AA and 4.5:1 for AAA. Each matrix cell renders sample text in the real pair, so passing and failing combinations are obvious at a glance.

Related tools

  • Accessible Link CheckerPaste HTML markup to flag vague, duplicated, empty, or context-poor link text before it ships.
  • Alt Text HelperGet the right alt attribute for any image based on its purpose and context, with copyable HTML and a screen-reader preview.
  • Touch Target CheckerCheck element dimensions and spacing against WCAG, Apple, and Material touch-target guidance in your browser.
  • Accessible Button GeneratorGenerate accessible button and link patterns for common interaction types, with a live preview, copyable HTML and CSS, and plain-language accessibility notes.
  • Accessible Form CheckerPaste form markup to flag missing labels, broken label and aria references, missing fieldset legends, and other accessibility failures.
  • ARIA Attribute HelperExplain and generate the ARIA attributes for common accessible UI patterns, with copyable markup.

More Accessibility tools