Finding the LCH Values of Named Colors
Type a standard CSS color keyword into the converter to extract its LCH (Lightness, Chroma, Hue) values. The tool maps the word to its sRGB equivalent, transforms it into the CIELAB color space, and uses trigonometry to output the cylindrical LCH coordinates.
Analyzing Perceptual Lightness
Converting named colors to LCH reveals the perceptual inconsistencies of the legacy CSS color dictionary.
If you look at the named colors yellow and blue, they seem like equal counterparts. However, converting them to LCH tells a different story. yellow has an LCH Lightness of roughly 97%, making it almost as bright as pure white. blue has an LCH Lightness of roughly 30%, making it quite dark.
By converting named colors to LCH, designers can accurately evaluate whether a specific CSS keyword has enough contrast to be used as a background color behind dark text, or if it needs to be adjusted for accessibility.