CSS Hue Rotate是变暗的图像

时间:2017-01-25 13:41:28

标签: css css-filters

我注意到CSS中的hue-rotate过滤器会使我的图像变暗。

请参阅https://jsfiddle.net/m4xy3zrn/

请注意,具有滤镜的第二张图像比在photoshop中旋转的第三张图像暗得多。

有没有办法阻止这种情况?

再看一遍,这里发生了很多奇怪的事情。黄色似乎几乎消失了,色彩彩虹(右上角)蓝色区域的饱和度大大降低。

2 个答案:

答案 0 :(得分:1)

The hue-rotate filter does not do a true hue rotation。它在RGB空间中进行了近似的色调旋转 - 非常严重地剪切了高度饱和的颜色(如原色)。 (在封面下,它是using this approximation)。没有办法避免这种情况 - 只要在关心颜色准确性时不要使用色调旋转。

(由于其不准确,我认为色调旋转滤镜应该固定,或从规格中移除。)

答案 1 :(得分:-1)

Photoshop使用HSB颜色模型,但CSS使用HSL。

  • 在HSB 亮度从100%的黑色(0%)变为全彩
  • 在HSL 亮度从黑色(0%)变为50%的全彩色,到 白色为100%

所以我认为他们都是对的,如果这是有道理的!