HexColorPicker

    Contrast Checker

    Check WCAG 2.1 accessibility compliance between foreground and background colors.

    Foreground

    Background

    Contrast Ratio

    17.06 : 1

    Normal Text

    AAA

    ≥ 4.5 AA · ≥ 7 AAA

    Large Text

    AAA

    ≥ 3 AA · ≥ 4.5 AAA

    Large Text Preview

    This is how large text (18px+ bold or 24px+) looks with these colors.

    Normal Text Preview

    This is how normal body text (under 18px bold / 24px) appears with these colors. Check readability carefully.

    WCAG Color Contrast Guidelines

    Color contrast is critical for web accessibility. The Web Content Accessibility Guidelines (WCAG) 2.1 define minimum contrast ratios between text and its background to ensure content is readable by people with visual impairments, including color blindness.

    WCAG AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18px bold or 24px regular). WCAG AAA requires 7:1 for normal text and 4.5:1 for large text. Meeting AA is considered the minimum standard; AAA is recommended for optimal accessibility.

    Poor color contrast affects approximately 8% of men and 0.5% of women who have some form of color vision deficiency. Beyond accessibility compliance, good contrast improves readability for all users, especially on mobile devices in bright sunlight or low-light conditions.

    Frequently Asked Questions