如何使用 CSS 使任何 SVG 图像灰度化？

Question

我有一些带有 svg 扩展名的图像。我需要以灰度模式获取这些图像。是否可以仅使用 css 或我可以对文件或

<svg>

标签本身执行的任何操作来完成此操作？我不想使用在线工具进行此转换，我需要纯样式“工具”，例如 html css js。我读过，向

<img>

标签添加类可能会有所帮助。顺便说一句，我需要它的原始质量，所以把它变成灰色是唯一的目标。

Answer 1

使用

<img>

和 CSS 函数

grayscale()

。

<img src="img.svg" style="filter: grayscale(1);"/>