HWB to LCH Converter

Converted LCH Output --
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 HWB to LCH

Converting HWB to LCH takes a legacy, sRGB-bound color format and translates it into a modern, perceptually uniform color space. Both formats use a cylindrical model (a Hue angle combined with brightness and intensity controls), but they calculate those values very differently.

HWB vs. LCH

HWB (Hue, Whiteness, Blackness) was designed to be easy for humans to write. It mimics mixing paint. However, because it is based on RGB math, it suffers from perceptual inconsistencies. A yellow and a blue with the exact same Whiteness and Blackness values will have drastically different perceived brightness levels.

LCH (Lightness, Chroma, Hue) solves this by basing its math on human vision. In LCH, the Lightness channel is absolute. This makes LCH highly effective for generating accessible color palettes, as you can guarantee the contrast ratio of a color just by looking at its L value.

Chroma vs. Whiteness/Blackness

In HWB, color intensity is controlled by how much white or black you mix in. In LCH, intensity is controlled by Chroma. Because human eyes are more sensitive to certain colors, the maximum Chroma varies depending on the hue. A vibrant yellow might reach a Chroma of 130, while a vibrant blue might only reach 100.

The Conversion Process

To convert HWB to LCH, the color must be translated into RGB, linearized, converted to the CIE XYZ reference space, and then transformed into CIELAB. Finally, trigonometry is used to convert the a and b axes of Lab into the Chroma and Hue of LCH.

Related Tools