Hacker News new | past | comments | ask | show | jobs | submit login

I’ve implemented[1] some of these algorithms into @texel/color, a modern JS color library, and it also supports gamut mapping to certain wide gamut color spaces (Display P3, Rec2020, Adobe 1998) rather than just sRGB.

https://github.com/texel-org/color

Many popular color libraries (Colorjs.io, culori) attempt to match CSS gamut mapping spec, which is an order of magnitude slower than the approach in Ottosson’s blog post, and also less accurate (CSS gamut mapping may not fall neatly on the gamut boundary).

[1] “Ported” might be a better term as I used a combination of Ottosson’s own JS OKHSL picker, Colorjs.io code, and Coloraide (Python), and adjusted it for performance, more gamuts, and smaller bundle sizes.




The method described at https://drafts.csswg.org/css-color/#css-gamut-mapping is equivalent to "Keep lightness constant, only compress chroma" from this blog post. They presumably picked that one because it is straightforward and should be good enough for the purpose at hand, which is figuring out what to do when someone puts an out-of-gamut color in their CSS.

The CSS spec doesn't say you have to implement this gamut clipping method via binary search. It's just one possible algorithm that is straightforward to describe so that people can get the intended result with a naïve implementation. Other clipping methods and better algorithms for accomplishing them require significantly more explanation with a bunch of math and color-model-dependent data.

The binary search approach is plenty fast for the CSS use case involving single isolated colors, but would not be appropriate for e.g. adapting photographic images from one output medium to another.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: