Contrast Check
WCAG contrast ratio for two colors.
How to use Contrast Check
Contrast Check — Measure the WCAG contrast ratio between a text color and a background color. Free to use in D2i DevTools — no account required.
Steps
- Fill in Text color. This field is required.
- Fill in Background color. This field is required.
- Click Run and copy the result under the form.
Frequently asked questions
What is Contrast Check used for?
Use it to see whether body text or a large heading will pass AA or AAA on that background.
How do I use the free online Contrast Check tool?
Fill in Text color. This field is required. Fill in Background color. This field is required. Click Run and copy the result under the form.
What can I paste or upload into Contrast Check?
Enter two colors as hex, rgb(), or hsl(). The first is the text color and the second is the background.
What output does Contrast Check give me?
The contrast ratio and pass or fail for normal text AA, normal text AAA, large text AA, and large text AAA.
Is Contrast Check free, and is my input private?
Yes — Your input is processed in memory for this request only. It is not saved to disk or the database, and it is cleared after the tool finishes.
Which threshold should I use?
Normal body text needs 4.5:1 for AA. Large text, about 18pt or 14pt bold, needs 3:1 for AA.
Inputs are processed in memory only and are not saved to disk or the database. Data exists only for the duration of your request.