1.34:1Contrast Ratio#c8d6bf and #ffefd3

AAAAA
Normal text
The visual presentation of text and images of text.
AA: 4.5:1, AAA: 7:1
FAIL FAIL
Large Text
Large-scale text and images of large-scale text.
AA: 3:1, AAA: 4.5:1
FAIL FAIL

Normal text sample

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat ex nec posuere consectetur. Sed vel enim sollicitudin, placerat dui pretium, mattis elit. Aenean leo erat, hendrerit eget mattis sed, vestibulum ut tellus. At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio.

Large text sample

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent volutpat ex nec posuere consectetur. Sed vel enim sollicitudin, placerat dui pretium, mattis elit. Aenean leo erat, hendrerit eget mattis sed, vestibulum ut tellus.

Details

Check the WCAG contrast ratio to another color, from 1 (same color) to 21 (contrast b/w white and black).

Contrast ratio is a measure of the difference in brightness between two colors. It is used to ensure visual elements have enough contrast to be seen by those with visual impairments.

Select two colors to get the contrast ratio, and see how the colors play with each other on the provided example.

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

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

See also

© PowerDev.Tools