dunplab - Web tools, generators and validators for best performances dunplab - Web tools, generators and validators for best performances Menù
  1. dunplab
  2. Tool and Validators
  3. Color contrast checker

Color contrast checker

Check if your color scheme meet the WCAG 2 AA contrast ratio thresholds

Insert colors

Background color

Foreground color

CHECK CONTRAST

Color contrast ratio

All text elements must have sufficient contrast between text in the foreground and background colors behind it in accordance with WCAG 2 AA contrast ratio thresholds.

Learn more

How does it work?

Level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text or for user interface components.

Level AAA requires a contrast ratio of at least 7:1 for normal text and 4.5:1 for large text.

Large text is defined as 14 point (18.66px) and bold or larger, or 18 point (24px) or larger.