RGB to LCH Converter

Converted LCH Output --

Alpha (Opacity) 100%

Wide-Gamut & Linear Formats

Modern CSS color space notations derived from this color

Contrast Analysis (WCAG 2.1)

Checks the converted color against foreground or background targets for accessibility compliance.

How to Convert RGB to LCH

Converting RGB to LCH (Lightness, Chroma, Hue) takes standard screen colors and maps them into a perceptually uniform, cylindrical color space. LCH is essentially the CIELAB color space, but reformatted to be much easier for humans to understand and manipulate.

Why LCH is Superior to HSL

At first glance, LCH looks a lot like HSL. Both have a Lightness channel and a Hue angle. However, HSL is mathematically flawed because it is based on the RGB color cube. In HSL, a pure yellow and a pure blue can both have a Lightness of 50%, even though the yellow appears blindingly bright and the blue appears quite dark to the human eye.

LCH fixes this. Because it is based on human perception, the Lightness channel is absolute. If you generate a palette of colors that all share an LCH Lightness of 60%, they will all have the exact same perceived brightness. This makes LCH the ultimate tool for generating accessible, high-contrast UI themes.

The Conversion Process

Converting RGB to LCH is a multi-step process that requires passing through two other color spaces first:

The RGB values are linearized (gamma correction is removed).
The linear RGB is converted into the CIE XYZ reference space via matrix multiplication.
The XYZ values are transformed into the CIELAB (Lab) color space.
Finally, the a and b coordinates of the Lab space are converted into Chroma (radius) and Hue (angle) using trigonometry (specifically the Math.atan2 function).