Color Converter — HEX, RGB, HSL, HSV, CMYK & OKLCH

The tool keeps one canonical representation of every color — an integer sRGB triple plus an alpha — and derives every output format from it. That means whichever format you paste, the other six are computed from a single source of truth, so they always agree to the rupee (or in this case, to the channel).

HSL and HSV. Both come from the same RGB extremes — the maximum and minimum channel set the hue angle and the saturation, while the lightness (HSL) or value (HSV) is computed from the bounds. The exact pseudocode lives in CSS Color Module Level 3, §4.2; OKLCH was added in Level 4. HSL is what designers expect; HSV (also called HSB) is what Photoshop, Affinity, and Figma show in their swatch panel. Both round-trip back to RGB to within 1 of 255.

CMYK. The page uses the un-color-managed identity formula: K = 1 − max(R, G, B) and C = (1 − R − K) / (1 − K) (and likewise for M and Y). Real-world print pipelines apply an ICC profile that knows your paper and ink set, but no in-browser tool can ship that for you — so the output here is a sanity-check starting point, not a press-ready separation. Adobe's own documentation describes the same identity transform.

OKLCH.sRGB is gamma-decoded to linear sRGB, multiplied through the LMS matrix from Björn Ottosson's OKLab paper, cube-rooted to LMS', multiplied again to OKLab, and finally converted to polar form (L, C, h). This is the algorithm CSS Color Module Level 4 normatively cites. The inverse is exposed too, so pasting oklch(60% 0.15 250) gives you the corresponding sRGB. Out-of-gamut OKLCH values are clamped per channel back into 0–255 — that's the only way to render them on an sRGB monitor, and the tool tells you when it happens via the parser hint.

Named colors.The 148 CSS named colors from CSS Color Module Level 4 §6.5 are stored as a plain table; pasting a name resolves to its exact RGB, and any RGB resolves to the nearest name by squared sRGB distance. The "Nearest" vs "Named" label tells you whether the match is exact or approximate.

WCAG contrast. Each channel is gamma-decoded with the sRGB transfer function, weighted by the BT.709 luminance coefficients (0.2126 R + 0.7152 G + 0.0722 B), and compared against pure white and pure black. The 4.5:1 (AA) and 7:1 (AAA) thresholds for body text come straight from WCAG 2.2 §1.4.3.

Color-vision simulation. The protanopia, deuteranopia, and tritanopia tiles use the Viénot–Brettel–Mollon (1999) display-space matrices applied directly to sRGB. Achromatopsia uses BT.709 luminance for an honest monochrome rendering. These match what the well-known Coblis and Daltonize tools render — useful for design QA, not a substitute for a real observer or a calibrated medical instrument.

Every conversion is silently round-trip verified against a fixed sample set (black, white, the primaries, sky-blue, the brand saffron, rebeccapurple, and a mid-gray). The result is shown as a badge in the calculator header — the same credibility check as the JSON formatter on this site.

• W3C — CSS Color Module Level 4 (named colors, OKLCH, sRGB transfer)
• Björn Ottosson — A perceptual color space for image processing (OKLab reference)
• WCAG 2.2 — §1.4.3 Contrast (relative luminance and contrast ratio)
• DaltonLens — Understanding CVD simulation (Viénot–Brettel–Mollon matrices)
• Adobe — Color modes (the un-color-managed RGB/CMYK identity formula)

Specifications and matrix coefficients last reviewed on 2026-05-11. The 148 CSS named-color table is checked against the CSS Color 4 REC at every release.