Put a text color against a background and see the contrast ratio, and whether it clears the WCAG thresholds.
Large text looks like this
And normal body text looks like this — the size that carries most of the reading on a page.
| Ratio | What it means |
|---|---|
| 1:1 | The same color. Invisible. |
| 3:1 | Minimum for large text, icons and UI borders. |
| 4.5:1 | Minimum for body text. The one most designs are judged on. |
| 7:1 | AAA for body text — comfortable for low-vision readers. |
| 21:1 | Black on white. The maximum possible. |
Contrast is about lightness, not hue. Two colors can look completely different and still fail — a mid-grey on a mid-blue reads as high contrast to the eye and lands near 1.5:1 in the maths.