The LCh Spectrum Navigator
The LCh (Lightness, Chroma, hue) color space is a cylindrical version of the Lab space, as HSL (Hue, Saturation, Lightness) is a cylindrical version of RGB. Unlike RGB, Lab is modeled on human vision, and is intended to be perceptually uniform. But unfortunately it is not very intuitive, and it is able to mathematically define colors that do not actually exist, so its use is not always straightforward. Also, while its uniformity in lightness is very good, that of hue is sometimes less so.
One advantage of LCh becomes apparent when attempting to define a range of hues with the same lightness. HSL hues of the same “lightness” may appear vastly different to the human eye, as can be seen in the HSL canvas below; blues, for example, appear much darker than cyans or yellows. But all the colors on the LCh canvas appear similar in lightness. On the other hand, one of the tradeoffs of using LCh is that a full range of hues is not available for every combination of lightness and chroma; the colors between the peaks do not exist in the display gamut. (If you uncheck “hide out-of-gamut colors,” the colors that appear have RGB values below 0 and/or above 255, and cannot actually be displayed; what you see is incorrect, with values pegged at 0 or 255, and the colors may no longer be perceptually uniform.) Note also that the hue numbers of HSL and LCh are not identical; 0 in HSL is red, for example, whereas in LCh it is between red and magenta.
It is important to note the emphasis on the display gamut. Lab and LCh are device-independent, which means that they define colors as they appear in real life, and to be accurately displayed they must be converted to the display color space. RGB red (255, 0, 0), on the other hand, just means “as red as the display gets.” Until recently, web browsers were intended to use the sRGB color space, which has a relatively small gamut; but as displays improve, browsers may be able to use wider gamuts such as Display P3. Selecting Display P3 for the LCh canvas below will actually display more colors than sRGB if your browser uses Display P3 and if your display gamut is wide enough to cover it. Otherwise, the displayed colors will simply be inaccurate.
Web standards now include LCh and Lab colors, even though they are not universally implemented. Since every LCh and Lab color is not a real RGB color, using them is not as simple as using HSL and RGB; if this is not taken into consideration, the advantages of using LCh and Lab may be lost. The LCh canvas below allows you to navigate the LCh space and select real colors.
HSL
L: 50
LCh
L: 50
|
L: 50
C: 30
h: 0
L 50, C 70, selected hues: