Color Converter & Contrast Checker
Convert common color spaces and test any foreground/background pair against WCAG contrast thresholds.
Use sliders or type values directly.
H (0–360)
S (0–100)
V (0–100)
WCAG 2.1 Contrast Ratio
vs. White
0.00 : 1
—
vs. Black
0.00 : 1
—
AA requires 4.5:1 for normal text, 3:1 for large. AAA requires 7:1 for normal, 4.5:1 for large.
0.00:1
—
Choose two colors.
Known-pair verification
The contrast math is checked against committed reference pairs
The converter maps between HEX, RGB, HSL, HSV, and a simple formula-based CMYK representation. The accessibility panel separately computes sRGB relative luminance and the WCAG contrast ratio for an arbitrary foreground/background pair.
Reference results from the bundled suite
| Foreground | Background | Ratio | Tool label |
|---|---|---|---|
| #000000 | #FFFFFF | 21.0000:1 | AAA |
| #777777 | #FFFFFF | 4.4781:1 | AA Large |
| #1F2937 | #FFFFFF | 14.6791:1 | AAA |
| #FF5733 | #FFFFFF | 3.1517:1 | AA Large |
| #0B57D0 | #FFFFFF | 6.3862:1 | AA |
The same cases are published with methodology in Z Tools Lab.
Important boundaries
- Contrast is not a full audit: the ratio does not evaluate semantics, focus states, reflow, motion, typography, or whether a large-text exception actually applies.
- CMYK is approximate: this page does not use a printer/paper ICC profile, so the CMYK output is not press-ready color management.
- Alpha is not modeled: the current HEX parser accepts 3- and 6-digit RGB values, not 4- or 8-digit alpha forms.
- Local processing: conversions and contrast calculations run in browser JavaScript.
For the luminance equation and threshold context, read WCAG Contrast Ratios: Calculation, Thresholds, and Known Pairs.