FM 10-01 Chapter 10 · Visual and media
Colour converter and contrast
Convert between HEX, RGB, HSL, HWB, OKLCH and CMYK, and check WCAG contrast between two colours.
Local only Runs in your browser. Nothing you enter leaves this page.
Usable as a step in Chain- HEX
- #1e3a5f
- RGB
- rgb(30 58 95)
- HSL
- hsl(214.2 52% 24.5%)
- HWB
- hwb(214.2 11.8% 62.7%)
- OKLCH
- oklch(34.62% 0.0736 256.04)
- CMYK (naive)
- cmyk(68% 39% 0% 63%)
- HEX
- #f3f0e8
- RGB
- rgb(243 240 232)
- HSL
- hsl(43.6 31.4% 93.1%)
- HWB
- hwb(43.6 91% 4.7%)
- OKLCH
- oklch(95.53% 0.0111 89.72)
- CMYK (naive)
- cmyk(0% 1% 5% 5%)
WCAG 2 contrast
10.10:1
- AA normal text (1.4.3)
- Pass, needs 4.5:1
- AA large text (1.4.3)
- Pass, needs 3:1
- AAA normal text (1.4.6)
- Pass, needs 7:1
- AAA large text (1.4.6)
- Pass, needs 4.5:1
- UI components and graphics (1.4.11)
- Pass, needs 3:1
Large text is at least 24 px, or 18.66 px bold. A translucent text colour is blended over the background first; a translucent background is blended over white. The ratio is rounded down so a fail never shows as a pass. APCA (the WCAG 3 draft method) is not included.
CMYK here is the naive formula without an ICC profile. Real print values depend on the press profile, so ask the printer. OKLCH colours outside sRGB are clipped per channel, not gamut mapped.