网站页面变成灰色

常用办法;

<style>

html {

          filter: grayscale(1);

      }

</style>

此方法用于首页变灰，当滚动页面时，依旧会恢复彩色

具体链接：一行代码，让网页变为黑白配色 - 掘金

其他办法：

1. 如果你需要全站置灰，使用 CSS 的 filter: grayscale()
2. 对于一些低版本的浏览器，使用 SVG 滤镜通过 filter 引入
3. 对于仅仅需要首屏置灰的，可以使用 backdrop-filter: grayscale() 配合 pointer-events: none
4. 对于需要更好兼容性的，使用混合模式的 mix-blend-mode: hue、mix-blend-mode: saturation、mix-blend-mode: color 也都是非常好的方式

有个小技巧，在 CSS 的世界中，但凡和颜色打交道的事情，你都应该想起 filter、backdrop-filter 和 mix-blend-mode。

具体来源：除了 filter 还有什么置灰网站的方式？ - 掘金