Loading…
Enter a text colour and a background colour and get the exact WCAG contrast ratio, with a pass or fail against every threshold that matters — AA and AAA, normal and large text, and the 3:1 bar for UI components — next to a sample you can judge with your own eyes.
Large text at 24px
Normal text at 14px — the size most interfaces actually run on, and the size the 4.5:1 bar exists for.
A bordered UI component
Contrast ratio 16.74:1
The CSS
color: #1c1917; background-color: #fafaf9; /* contrast 16.74:1 */
Set what you want and the result appears as you go. Nothing needs uploading because there is nothing to upload — you are describing what to make, not sending us anything.
Your browser does all the work locally, using your own operating system where randomness is involved. Nothing is requested from a server, so nobody else has a copy of what you made.
One press puts it on your clipboard, ready to paste where you need it. There is no file to download — the result is text, not a document. Nothing is kept — refresh the page and it’s gone, so take what you need before you leave.