Data serialization ·
Color space math: HEX, RGB, HSL, and CMYK in JavaScript
A HEX color is a compact sRGB triple (or quadruple with alpha). RGB to HSL is a cylindrical remap of the same cube. “CMYK” in a web tool without an ICC profile is usually C=1-R, Y=1-G, M=1-B with a black extraction. That is not a press-ready conversion. Do the math locally; check WCAG on the sRGB result.
HEX parse
Strip #, expand shorts, parseInt 16. Clamp 0–255. Invalid HEX should error, not become black silently.
HSL cylinder
H 0–360, S and L 0–1. Conversion to RGB is piecewise. Designers edit HSL; contrast still uses RGB linear luminance (Post 11).
Naive CMYK
K = 1 - max(R,G,B); C = (1-R-K)/(1-K) etc. No paper, no ink limits, no FOGRA. Label it “simple CMYK” so print shops do not sue your blog.
Matrices and D65
Going to CIE XYZ uses a matrix under a white point. Full color management is out of scope for a HEX widget. Mention it so crawlers know you know.
Pair with contrast and palettes
After a tweak, check AA. Palettes that only rotate H in HSL can still fail contrast. Tools are a loop, not a one-shot.
Frequently asked questions
Does the converter use ICC profiles?
Typical web converters do not. For print, use a CMS. For CSS, sRGB (and increasingly P3) is the game.
3, 4, 6, or 8 digit HEX?
CSS allows #rgb, #rgba, #rrggbb, #rrggbbaa. Expand shorts by duplicating digits.
Why does HSL lightness not match WCAG luminance?
HSL L is a crude average-style lightness. WCAG uses linearized relative luminance. Always run the contrast formula on RGB, not on HSL L.