HEX to LCH Converter
Convert a HEX color to the perceptually uniform CIE LCH color space, with CSS-ready output.
rgb(59, 130, 246)
CIE LCH
lch(55.63% 66.78 285.24)
CIE Lab
lab(55.63% 17.55 -64.43)
CSS Snippets
color: lch(55.63% 66.78 285.24);color: lab(55.63% 17.55 -64.43);background-color: lch(55.63% 66.78 285.24);HEX and CIE LCH color, explained
CIE LCHis the cylindrical representation of CIE L*a*b* — Lightness, Chroma (colorfulness), and Hue (angle in degrees). Because it's derived from the perceptually uniform Lab space, equal changes in L, C, or H correspond more closely to equal changes in perceived color than HSL does, which makes LCH useful for building smooth gradients, accessible color scales, and consistent tints and shades. This converter parses your HEX color, converts sRGB to linear RGB, transforms to CIE XYZ (D65 illuminant), then to CIE L*a*b*, and finally derives the cylindrical LCH coordinates — entirely in your browser. LCH color is supported in modern CSS via the lch() and lab() functions (Chrome 111+, Firefox 113+, Safari 15+).
Prefer a different perceptual space? Try OKLCH Color Converter, or convert back with HEX to RGB, or use the all-in-one color converter.
Built and maintained by Meet Shah · Last updated
What this tool is used for
- Converting a hex palette into a perceptually uniform space.
- Getting Lab coordinates alongside the polar LCH form.
- Building a scale where each step looks evenly spaced.
- Producing CSS `lch()` or `lab()` output from a legacy palette.
- Getting both the polar LCH and Cartesian Lab forms of one colour at once.
Frequently Asked Questions
- What does converting to LCH give me?
- Three numbers you can reason about: lightness that matches perception, chroma as distance from grey, and hue as an angle. It is CIELAB in polar form, which turns "same colour, less vivid" into changing one number instead of solving for two axes.
- Why does the hue angle not match the HSL one?
- Because the two wheels are built differently. HSL's hue comes from RGB geometry and LCH's from perceptual data, so blue sits at a noticeably different angle in each. The colour is identical — only the coordinate describing it differs.
- What chroma values are achievable?
- It depends entirely on hue and lightness. Yellow reaches far higher chroma than blue at the same lightness, which is why there is no single maximum and why a palette built at constant chroma will fall outside the gamut for some hues and not others.
- How is this different from OKLCH?
- Same structure, better-fitted maths. CIELAB has known non-uniformities around blue and purple where hue appears to shift as lightness changes; Oklab was derived specifically to correct them. For new work OKLCH is the better default.
- What happens with an out-of-gamut result?
- Converting hex to LCH always produces a valid result, since every sRGB colour is inside LCH's range. Going the other way is where clipping happens — LCH describes far more than sRGB can show, which is the asymmetry to remember when round-tripping.
Common errors and gotchas
- Ignoring the illuminant, since a Lab or LCH value means different things under D50 and D65.
- Reading LCH lightness as HSL's, which are defined differently and not comparable.
- Confusing CIE LCH with OKLCH, which share a structure and differ in behaviour.
- Assuming every LCH value maps back into sRGB, when many must be clipped.
- Assuming a hex from an untagged image was sRGB, which the conversion has to presume.