html {
  filter: invert(1) hue-rotate(180deg);
}

CSS 滤镜 filter 属性允许你对元素应用图形效果，如模糊或颜色偏移。而 filter: invert(1) hue-rotate(180deg) 是一组特定的滤镜组合，用来改变选定元素的颜色表现。 下面详细解释一下它代表的含义：

1. invert(1):

   • invert() 函数用于反转输入图像中的颜色。参数定义了转换的程度。如果参数是 1（或者 100%），则会完全反转颜色，即每个颜色通道的值都会被替换为其补色。例如：黑色变成白色，白色变为黑色等。

   • 当使用 invert(1) 时，则表示将图像的颜色彻底反转，即是：黑色变成白色，白色变为黑色。

2. hue-rotate(180deg):

   • hue-rotate() 函数按照给定的角度旋转色彩轮上的颜色，其实就是冲淡颜色。这里的“角度”是指在标准色轮上转动多少度。色轮是一个圆形图表，显示了不同颜色如何根据它们的色调相互关联。

   • 当使用 hue-rotate(180deg) 时，意味着所有颜色都会在其原始位置基础上沿着色轮顺时针方向移动 180 度。比如红色会变成青色、绿色变成洋红色、蓝色变成黄色等，因为这些是在色轮上相对的颜色。

结合起来看，首先通过 invert(1) 将图像的所有颜色都进行了反转处理，然后通过 hue-rotate(180deg) 再进行一次颜色的大幅度调整，这种组合可以产生非常独特的视觉效果。 所以，对于希望快速实现网站的暗黑模式，使用 CSS 的 filter 属性可以是一个非常简便的方法。通过 invert(1) 将颜色反转，再用 hue-rotate(180deg) 调整色相，可以达到一个基本的暗黑效果。 这种方法的优点是简单快捷，但它也有缺点，因为它可能无法很好地处理图像和其他颜色复杂的内容。