Developer Tools

    Color Contrast Checker

    Test text and background colors for WCAG compliance

    Contrast Statistics

    Contrast Ratio:3.68 : 1
    Normal Text (WCAG AA - 4.5:1)
    FAIL
    Large Text (WCAG AA - 3.0:1)
    PASS
    Normal Text (WCAG AAA - 7.0:1)
    FAIL
    Large Text (WCAG AAA - 4.5:1)
    FAIL
    Large Text Sample (Bold)Normal text sample. This shows how your color combination looks in practice for paragraph text.

    About Color Contrast Checker

    Check relative color contrast compliance ratios under WCAG 2.1 accessibility specifications. Shows AA and AAA status details for small and large texts with real-time swatch preview.

    Ensures your website designs remain accessible and readable for all users.

    How to Use Color Contrast Checker

    1. 1Choose your text color and background color using the visual picker or hex inputs.
    2. 2Review the resulting contrast ratio score.
    3. 3Check the AA and AAA badges to verify readability status.
    View all Developer Tools

    More Free Tools