如何仅反转H，S或L中的一个？

Question

我一直在使用谷歌浏览器的Stylish扩展程序来浏览xkcd in dark。名为Dark XKCD的用户风格使用filter: invert(100%);来使通常为白色的图像变暗。但是，invert会混淆色彩，例如在这个漫画中，通常看起来像这样：

但相反，它看起来像这样（片段，因为很难简单地保存图像）：

img {
  max-width: 70%; /* make image easily visible for demonstration */
  filter: invert(100%);
  -webkit-filter: invert(100%);
  -moz-filter: invert(100%);
}

<img src="https://imgs.xkcd.com/comics/gravity_wells.png"/>

橙色变成蓝色！

我找到了hue-rotate，如果我申请使用反转，则会对其进行半固定：

img {
  max-width: 70%; /* make image easily visible for demonstration */
  filter: invert(100%) hue-rotate(180deg);
  -webkit-filter: invert(100%) hue-rotate(180deg);
  -moz-filter: invert(100%) hue-rotate(180deg);
}

<img src="https://imgs.xkcd.com/comics/gravity_wells.png"/>

然而，其他漫画却失败了;例如，this one：

img {
  filter: invert(100%) hue-rotate(180deg);
  -webkit-filter: invert(100%) hue-rotate(180deg);
  -moz-filter: invert(100%) hue-rotate(180deg);
}

<img src="http://imgs.xkcd.com/comics/making_rules.png"/>

我现在可以将图像的色调或饱和度和亮度混合在一起，但也许如果我可以解除饱和度和亮度的反转，我可以获得更好的效果。

如何在不触碰其他色调的情况下反转色调，饱和度或亮度？

Answer 1

您无法在过滤器中执行HSL操作 - 它们仅适用于RGB。过滤器色调旋转是使用RGB空间的真实色调旋转的（通常是坏的）近似。在过滤器中可以做一些复杂的事情，以便将颜色分开。从灰色/白色中取出彩色区域，分别翻转然后重新组合。但它不是一个很好的通用解决方案。