Large text sample
Normal body text sample — the quick brown fox jumps over the lazy dog.
Contrast ratio
—
- Normal text (AA ≥ 4.5)
- —
- Normal text (AAA ≥ 7)
- —
- Large text (AA ≥ 3)
- —
- Large text (AAA ≥ 4.5)
- —
- UI & graphics (≥ 3)
- —
🔒 All calculated in your browser.
Using an AI agent or a script? Call this tool as an API
AI agents and scripts can call this tool directly, to check their work or look something up, and get JSON back with the same answer this page gives. No key needed.
GET https://digitalgreenhouse.com.au/api/tools/contrast-checker?fg=%23767676&bg=%23FFFFFFfg— string, required. Text (foreground) colour: HEX, rgb() or hsl(). Also accepted asforeground,text.bg— string, required. Background colour: HEX, rgb() or hsl(). Also accepted asbackground.
The API answers from our server, and our code doesn’t store what you send. Fair-use limits apply. API guide · all endpoints (JSON) · OpenAPI
What the numbers mean
Contrast ratio runs from 1:1 (no contrast — same colour) to 21:1 (black on white). The WCAG standard sets minimums so text stays readable for people with low vision or colour-blindness — and, frankly, for everyone on a sunny day or a cheap screen.
- Large text means 18.66px bold, or 24px and up.
- AA is the common legal/contractual target; AAA is the gold standard.
- UI & graphics (icons, form borders, chart colours) need at least 3:1.
Does my website legally need to pass this?
In Australia, the Disability Discrimination Act applies to websites, and government and many enterprise contracts require WCAG 2.1 AA. Even where it’s not mandated, it widens your audience and improves usability for everyone.
My brand colour fails — what now?
Often a small tweak to lightness fixes it without losing the brand feel, or you reserve the brand colour for large headings and use a darker shade for body text. We do this kind of accessible design work as part of building sites.