My name is Sofi. I am CSS engineer. This is my blog.

If you're really hurt without styles, you can them on.

.

Color space and color gamut

The color() - is the phenomenal css function!

When other color functions provide you to define color in different spaces, this one provide you able to choose the color gamut. So, this one is very good for explain that gamut and space are a different things.

Gamut - is a set of colors that you screen can display.

Space - is way to set a specific color from defined gamut.

When you use a HEX or a rgb(), you define color by RGB-cube (as a space) in an s-rgb (as a gamut). Same way, when you use a hsl(), you define a color by HSL (as a space) in an s-rgb (as a gamut). Kind of same way, when you use a lch(), you define a color by LAB, (as a space) in an infinite (as a gamut).

So, at all this cases, you can't choose space and gamut separately. Function already did it instead you. But! If you use a color() function, you can!

color(srgb 1 1 1) - define color by sRGB space in s-rgb gamut. color(display-P3 1 1 1) - define color by sRGB space in display-p3 gamut.

This case is perfect for show the difference between terms space and gamut. You can use the every system for define concrete color in every set of colors. RBG-cube and HSL are just a coordinate system, that can be used in every set of colors.