tylergaw / colorme

Visualize CSS Color Functions?
https://colorme.io
MIT License
316 stars 14 forks source link

Color transforms are performed in the wrong color space. #12

Closed slime-horse closed 4 years ago

slime-horse commented 7 years ago

The RGB/HSL color format used in this project and css is sRGB which is a logarithmic scale (aka 255 scale). Before performing any calculations to a color it has to be converted a linear color space (aka 1.0 scale) for accurate color transformations.

To lean more about Gamma/LinearRGB vs sRGB this is a great read. http://blog.johnnovak.net/2016/09/21/what-every-coder-should-know-about-gamma/

Here are some site talking about conversion algorithms. http://www.ryanjuckett.com/programming/rgb-color-space-conversion/ http://entropymine.com/imageworsener/srgbformula/

This site lets you convert Non Linear sRGB to linear RGB. http://davengrace.com/cgi-bin/cspace.pl

slime-horse commented 6 years ago

@tylergaw It took me a year to get around to it but I've created a npm module for converting logarithmic sRGB values to linear sRGB values.

https://www.npmjs.com/package/srgb-logarithmic-and-linear-colour-conversion