Also, I'm not understanding why HSL doesn't automatically inherit the P3 color space without any code changes. It shouldn't require any additional syntax, the HSL model is describing abstracted color values, unlike HEX or RGB which are hardcoded values.
Unless I'm not understanding this correctly. If that's correct, it seems strange and sloppy to require the display-p3 definition.
Because an HSL value translated directly to sRGB will look different when translated to P3. The color spaces themselves define different ranges of R, G, and B. The only backwards-compatible method to derive P3 colors from HSL values would be with saturation and lightness values greater than one.
Re:Wide Gamut Color in CSS with Display-P3
by klodolph on Tuesday March 03, 2020 @01:10AM
(#22472239)
HSL is not really abstracted. Instead, it is just a different way of specifying RGB values. So you can't have HSL switch to the P3 color space, because you would end up with color shifts.
In other words, same HSL => same RGB, and same RGB but different space => often a different color.
Re:Wide Gamut Color in CSS with Display-P3
by klodolph on Tuesday March 03, 2020 @01:08AM
(#22472233)
If you need color profiles, then you are beyond tweaking the HSL values by hand in CSS. The main value in using color profiles is so you can use an exact color match with an image using that profile, and if you're doing that, it's more natural to have an RGB value. So, providing HSL doesn't really add any value here, as far as I can tell.
hsl is a much nicer syntax for humans to describe color than rgb channels.
I'm sure there are good reasons under the hood, but why that syntax over something like:
``` header { color: hsl(42, 70%, 50%); color: hsl(display-p3 42, 70%, 50%); } ```