Donation  Momo Buy me a coffee!

WCAG Color Contrasts

WCAG Color Contrasts
WCAG Color Contrasts
WCAG Color Contrasts online Function

WCAG 2 Color Contrasts

This tool will compute the contrast ratio of varying color text against a specified background color and show compliance to WCAG 2 AA and AAA standards for minimum contrast ratios. Adjusting the range slider left and right to darken and brighten the background color can help you find a shade that meets the AAA standard. Note that the ratio is the same when the foreground and background color are swapped. For example, black text on a red background and red text on a black background have the same ratio.

Why is contrast important? There are a variety of factors which affect readability of your website’s text, including biological (poor or failing eyesight) and environmental (projected onto a screen in a bright room or in the sun in a park on a tiny phone screen). Displaying your content with higher contrast generally improves readability, and thus comprehension, of your content. Furthermore, certain sectors (including public/governmental institutions in the U.S.) are required by law to meet minimum contrast ratios for a11y (accessibility).

Color Inputs

# #ffffff

1 ← Darken - Lighten →

# #003366


Black samples: Contrast = 21 (AAA) Contrast = 21 (AAA)
White samples: Contrast = 1 (fail) Contrast = 1 (fail)
Arbitrary color samples: Contrast = 12.6 (AAA) Contrast = 12.6 (AAA)

Privacy notice:

 All content generated by this tool is done on your computer via client-side JavaScript whenever possible, or on the SoiPro server as a fallback if not. No submitted or generated data is recorded or stored by NVH Corp. See the website privacy statement regarding general use of this website.    


About the Author

Hello this is NVH Corp, I am Web Designer and Expert at SoiPro(dot)Com

Đăng nhận xét

Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.