HEX to LCH converter

LCH is Lab in polar form, so you can adjust saturation or hue without changing perceived lightness.

Loading the tool…

Processing and privacy: The result is calculated inside your browser and your data is not sent to any server.

How to use it

  1. Enter hex color code and reference white.
  2. The result appears straight away and updates as you edit.
  3. Copy the result, or copy a link that keeps the same values to share it.

How it is calculated

Each channel c (0 to 1) is linearised per IEC 61966-2-1: c / 12.92 if c ≤ 0.04045, otherwise ((c + 0.055) / 1.055)^2.4. X = 0.41239R + 0.35758G + 0.18048B, Y = 0.21264R + 0.71517G + 0.07219B, Z = 0.01933R + 0.11919G + 0.95053B (matrix derived from the sRGB primaries and D65 white). L* = 116 f(Y/Yn) − 16, a* = 500 (f(X/Xn) − f(Y/Yn)), b* = 200 (f(Y/Yn) − f(Z/Zn)), with f(t) = ∛t if t > 216/24389, else (24389/27 t + 16) / 116. For D50, XYZ is adapted from D65 to D50 with the Bradford matrix first. C = √(a² + b²), h = atan2(b, a) in degrees from 0 to 360.

Example

Inputs: HEX color code = #FF5733, Reference white = D65 daylight, no adaptation (sRGB white). Result: LCH values: L* 60.18, C* 82.48, h 41.2°; Lightness L*: 60.1758; Chroma C*: 82.4844.

#FF5733
L* 60.18, C* 82.48, h 41.2°

Limits and caveats

  • HEX and RGB are assumed to be sRGB; Display P3 or Adobe RGB colors need their own ICC profile.
  • For grays chroma is zero and hue is undefined, so it shows as 0°.

Questions about this tool

How is LCH different from HSL?

HSL is computed straight from RGB, so its colors do not look equally bright. LCH comes from Lab, so colors with the same L* look about equally light.

Does CSS lch() use D50?

Yes, CSS Color 4 defines lab() and lch() on the D50 white, which is why the CSS line appears only with D50.

What is the highest chroma?

There is no fixed theoretical limit, but sRGB colors stay below about 135, with pure blue and green at the top.