Javascript 使用不同的颜色在png上设置相同的颜色过滤器

我有很多.png格式的图标，但是它们的颜色不同，也不一样

有没有一种方法可以在css中设置一个特定的过滤器颜色，将我的所有png图标转换为相同的颜色

---

就像橙色会变成紫色，绿色也会变成紫色一样？

下面是一个例子，说明如何实现这一点（颜色不是完美的搭配，但我不想花几个小时来调整）：

.orange:悬停{
滤镜：色调旋转（250度）亮度（110%）；
}
.格林：悬停{
滤镜：色调旋转（160度）亮度（70%）；
}

您可以使用注释和上一个答案中指出的“过滤器”进行过滤。因为你的图标有很多颜色，你需要对每个图标应用不同的过滤器，或者。。。使用两个滤镜：第一个滤镜使它们都“颜色相同”，第二个滤镜再次“着色”以获得所需的颜色

filter: sepia(100%) hue-rotate(90deg);

无论如何，这将取决于对目标浏览器的支持

---

您可以在图像编辑软件中执行同样的操作：使图像灰度化，然后编辑颜色曲线以获得所需的颜色。

我能想到的最接近的是CSS过滤器（），但这在浏览器支持方面相当有限。实际上，这是一个图像编辑工具的工作，然后再上传它们。如果你想让它们转换，那么拥有两个图像并用不透明来伪装转换会更可靠，我有很多图标，我想要一个解决方案谁将自动设置良好的色调和亮度取决于pngcolors@Aotoki在使用Photoshop或其他图像编辑工具之前，有什么原因不能更改它们吗？用Photoshop一个接一个地编辑所有图像是对时间的极大浪费，因为没有多少。。。，无论如何，谢谢你的帮助。你可以用一个“动作”（本质上是一个宏）在PS中自动完成这项工作。至少他们以前是这么叫的。您定义它一次，然后告诉它在一个包含图像的文件夹中运行。对于重复性任务来说，它就像一种魅力。