HEX to LCH Converter

About the HEX to LCH Converter

What is HEX to LCH conversion?

LCH is the polar form of the venerable CIELAB color space: Lightness from 0 to 100, Chroma (how far from gray, up to about 130 for screen colors), and Hue in degrees. It has decades of color science behind it and is now a native CSS format via lch(). This converter takes any HEX code and returns its exact LCH value — using the D50 white point that the CSS specification and tools like Photoshop use — alongside RGB, HSL, OKLCH, LAB, HWB and CMYK.

Like OKLCH, LCH is perceptually meaningful: raise L and the color gets genuinely lighter, raise C and it gets purer, all without the brightness surprises HEX and HSL hide. Everything is computed in your browser as you type or drag, and nothing is uploaded.

How to Use This Tool

1. Enter a HEX code. Type or paste it, use the color swatch, or pick from your screen with the eyedropper.
2. Read the LCH value. The lch() string heads the results, formatted the way CSS expects it.
3. Adjust if needed. The R, G and B sliders let you fine-tune the input while every format follows live.
4. Copy and compare. OKLCH and LAB sit right below, so you can compare the classic and modern perceptual formats side by side.

Common Use Cases

• Perceptual palettes: Build lightness ramps in LCH that step evenly to the eye.
• CSS lch(): Feed the value straight into stylesheets targeting modern browsers.
• Color-science workflows: LCH numbers plug into Delta-E difference calculations and print-adjacent tooling.
• Cross-checking OKLCH: See how the older CIE model and OKLab disagree about a color's chroma or hue.
• Analyzing brand colors: Express a HEX palette in terms a colorist can reason about.

Need the reverse? Use the LCH to HEX converter, try OKLCH instead, or browse all our free color tools.

Frequently Asked Questions

What is LCH?

LCH is CIELAB expressed in polar coordinates: Lightness (0-100), Chroma (0 for gray, up to roughly 130 for vivid screen colors), and Hue in degrees. It is a perceptual format, meaning equal numeric steps are designed to look like equal visual steps.

What is the difference between LCH and OKLCH?

Both are lightness-chroma-hue models, but OKLCH is built on the newer OKLab space that fixes known quirks of CIELAB, particularly a blue-hue shift when desaturating. LCH has decades of tooling behind it; OKLCH is what newer CSS work tends to prefer. This page shows both so you can compare.

Which white point does the conversion use?

D50, matching the CSS Color 4 specification for lab() and lch() and the behavior of tools like Photoshop. If another tool gives slightly different numbers, it is most likely using a D65 white point.

Can I use LCH in CSS?

Yes, lch(54.3% 106.8 40.9) is valid CSS supported in all major evergreen browsers since 2023. Provide a hex fallback if you still support older browsers.

Is this tool free and private?

Completely. The conversion runs entirely in your browser with JavaScript, nothing you enter is uploaded or logged, and the page keeps working offline once loaded.