Advertisement

Preview Text (24px)

Normal text preview (18px)

Small text preview (14px)

Advertisement

About WCAG Contrast Requirements

What is Color Contrast?

Color contrast ratio measures the difference in perceived brightness between foreground and background colors. Higher ratios mean better readability.

WCAG Standards:

  • Level AA (Minimum):
    • 4.5:1 for normal text (<24px or <18px bold)
    • 3:1 for large text (≥24px or ≥18px bold)
  • Level AAA (Enhanced):
    • 7:1 for normal text
    • 4.5:1 for large text

Related Tools