Skip to content

    Accessibility contrast checker

    Pick a text colour and a background colour to see the exact WCAG contrast ratio and whether it passes AA and AAA. Poor contrast is the single most common accessibility failure on small business websites.

    Normal body text at 16px. The quick brown fox jumps over the lazy dog.

    Large text at 24px looks like this.

    Bold large text at 18.66px counts as large too.

    15.95:1

    Contrast ratio, from 1:1 at worst to 21:1 at best.

    AA, normal textNeeds 4.5:1Pass
    AA, large textNeeds 3:1Pass
    AAA, normal textNeeds 7:1Pass
    AAA, large textNeeds 4.5:1Pass

    Large text means 24px and above, or 18.66px and above when bold. AA is the level most UK organisations aim for and the level referenced by the public sector accessibility regulations. AAA is stricter and worth hitting for long passages of reading.

    Accessibility overlaps heavily with usability and search. Read more about how I approach web design.

    Rather have someone do it for you?

    If your brand colours keep failing, there is usually a workable pairing hiding in the palette. I can sort that out as part of a build or redesign.

    Get in touch

    Or see what a site costs and the other free tools.