Now we are ready to introduce the last color space I want to talk about, and probably the best one. So this is the CIE LCh, sometimes also just called HCL space. And this is the color space that integrates all the good properties that we want to have. So we want to have, as we said, uniformity, but also intuitiveness or usability. Okay, so how is this color space created? Well, the details are a little complicated, but you have to think of this as a new transformation from the CIE lab color space into a new color space that is defined in cylindrical coordinates. Very similar to what we have seen before with the HSV space, but with the main difference that now this space is perceptually uniform. Okay, so more precisely, the a and b components of the lab or of the CIE lab space are converted into new components. The first one is called chroma. And the chroma corresponds roughly to saturation, so how vivid or colorful the color is. The next one is hue, and is expressed as an angle, the angle part of the cylindrical space, and it represents the hue, the name of the color. Red, green, blue, yellow and so on. And the last one is unchanged, which is the lightness component, which is always the same. So let me show you a few visual representation of this space. This is one possible representation of the 3D space that is defined by the HCL color space. So in this particular diagram, what you have is that the lightness is changing on the vertical direction. And then, you have the chroma component, which is the saturation that is changing on the radial direction. And then, you have the angle that is changing the hue. And you can see here, as the angle is changing, the color hue is changing. As you move radially, you have more or less saturated colors. And as you move from bottom to top, you have darker and brighter colors. Here is another diagram that shows the same idea. So you go from left to right. The lightness changes. And for each of these slices, as you move from the center to the outer rims, you see that the color is changing in terms of saturation. And the angle is changing the hue. One thing you should notice here that is more clear from this diagram, is that once again, in uniform color spaces like this one, when one parameter is changing, the range, the area of the colors that are that is available for that specific parameter, changes. So in this particular case, as we change the lightness, the all range is changing from being very small ones to very big ones. And also the shape is changing. This is going to be even clearer in a moment when I show you a new demo. Here, I'm using, once again, one of the color pickers that I used before, with the main difference that now, rather than using the Lab space, I'm showing the Lch space, the new space that I've just described. So as you can see here, once again, we have three sliders corresponding to the three axis of the space. But now, we have the L, which is luminance, c which is chroma, or the saturation, and h which is hue. So let's see how the color changes as I move the sliders and move through the space defined by the Lch axis. So luminance is always the same. So it's getting darker and lighter, okay? So but now, look at this. When I change the chroma component, the color is getting more saturated or less saturated. And when I'm changing the u component, I'm basically going through by keeping constant the lightness and the saturation, I get lots of different colors. So we have magenta, orange, red, green, blue, purple, red, and so on. Okay, so now, let me show you How the Lch color space looks like with the other color picker that we used before. Okay, here, we have the other color picker that we used before. But once again, rather than showing the CIE lab color space, now we are showing the hue, chroma, and lightness. Which is basically the same as what we call CLCH, okay? So here, in this representation, we have once again two axis that are mapped to two of the axis of the color space. And another axis that can be changed by dragging the value here, changing the value of this slider. Okay, let me show you a few things. First of all, here now, by default, we have on the x-axis, we have the hue component, and on the y-axis, we have the lightness component. And as you can see, when we go from top to bottom, the colors are always getting from dark, very dark, to very light, as we may expect. And as we go from left to right, we have colors that have the same level of lightness, okay? So as you can see, with the color picker here, I'm picking colors that go through many values of the hue spectrum. So see the colors here? And they all have exactly the same lightness. So if I move the color picker here, you can see that they're all lighter, okay? Exactly the same amount of lightness. And they go through several values of hue, okay? Another thing to notice, as we have seen before, is that as we change one of these values, so here, I'm changing the chroma, not all possible values in the HL space are available. Look, there are some holes. And this is almost always true. Let me see how this looks like when I change the axis. So, in this case, now I have the chroma component on the x-axis, and the lightness component on the y-axis. And now, I'm changing the u-axis here. As you can see, the are different hues, but also the area that is covered is different. It changes as I change the slider, okay? And exactly the same is true when I have the hue component on the x-axis, and the chroma component on the y-axis.
