Everything from

WebAIM

1 resource from WebAIM we point founders to, and the questions each answers.

🛠️ Tool
✓ Link checked Free Beginner

Why we picked it A pretty palette that no one can read reads as careless, and this is the fastest way to catch that before it ships. Paste a foreground and background hex, and it tells you instantly whether the pair passes WCAG AA and AAA for text and UI elements, so your brand colors survive contact with real screens and real eyes. Run your buttons, links, and body text through it, and fix the near-misses that would otherwise make your product feel low-effort.

WebAIM Contrast Checker

From WebAIM by WebAIM

  • Aim for at least 4.5:1 contrast for body text and 3:1 for large text and UI components (borders, icons); anything below reads as hard to use.
  • Your prettiest brand color is often your least legible: test it as button text and link color, not just as a swatch, and darken or pair it as needed.
  • Use the pass or fail readout to keep a color while adjusting only its shade, so you stay on brand and stay readable at the same time.
Open webaim.org