自从 Apple 在 MacOS 10.14 中将其发布为系统设置 并在随后作为 Safari 的一部分发布以来，我们一直在讨论 Dark Mode。 它很有趣，因为它既打开了设计机会，也根据用户的实际偏好定制用户体验。
本周，我们获得了 颜色调整模块 1 规范的编辑草案 和其 第一个公开工作草案。 所有这些都是正在进行的工作，但是跟踪它的进展很有趣。 该规范引入了三个新的 CSS 属性，这些属性有助于告知用户代理在根据用户偏好确定渲染页面的视觉外观时应该拥有多少控制权。
color-scheme 是规范中定义的第一个属性，也许也是其核心。 它接受 light 和 dark 值，正如您可能猜到的那样，它们分别对应于支持它们的操纵系统的亮模式和暗模式偏好。 值得一提的是，我们可能正在处理除“亮”和“暗”以外的标签（例如“白天”和“夜晚”），但我们正在处理的归结为亮色方案与暗色方案。
这个单独的属性具有重要的意义。 首先，它的理念是让我们能够根据用户的系统偏好设置样式，这使我们能够对该体验进行细粒度的控制。
另一个可能的意义是，声明该属性本身使用户代理能够承担部分责任来确定元素的颜色，其中声明 light 或 dark 通知用户代理元素“知道”颜色方案，并且应该根据与该值匹配的偏好设置进行样式设置。 另一方面，我们可以通过使用 auto 值让浏览器完全控制来确定要使用的颜色方案，具体取决于用户的系统偏好。 这告诉浏览器元素“不知道”颜色方案，并且浏览器可以使用用户偏好和系统默认样式作为指南来确定如何继续。
值得注意的是，我们可能还有一个 prefers-color-scheme 媒体特性（目前位于 媒体查询 5 级规范的编辑草案 中），它也有助于我们检测用户的偏好，并帮助我们根据系统偏好更好地控制用户体验。 Robin 有一个关于它的 很好的概述。 颜色调整模块 1 级工作草案也 提到了 可能会在 <meta> 元素中使用颜色方案值来指示颜色方案支持。
当然，该属性还有更多内容，包括 only 关键字，链接值以指示优先级顺序，甚至是一个开放式的自定义标识符关键字。 所以一定要深入研究，因为有很多东西需要学习。
相当有趣，对吧？ 希望您开始了解这个草案如何开辟新的可能性，甚至会影响我们做出设计决策的方式。 这仅仅是开始，因为还有另外两个属性！
forced-color-adjust：当我们想要支持颜色方案但用我们自己的 CSS 覆盖用户代理的默认样式表时，会使用它。 这包括关于可能将此合并到color-adjust中的说明。color-adjust：与强制 CSS 覆盖到用户代理不同，此属性向浏览器提供一个提示，表明它们可以根据用户的偏好和其他因素（例如屏幕质量、带宽或“认为输出设备需要和谨慎”的任何因素）更改颜色值。 Eric Bailey 总结了此属性在用例、增强可访问性和一般实现方面可以打开的可能性。
当前草案肯定会扩展，但是，这就是我们了解 W3C 作者正在做的出色工作，获得他们面临的挑战的背景，甚至 为这项工作做出贡献 的地方。 （请参阅 Rachel Andrew 关于 做出贡献的建议。）
一些澄清…
color-scheme: auto首先，CSS 工作组 刚刚决定将其重命名为
color-scheme: normal以明确表明这不是自动的。其次，当此值表示元素/页面“不知道”颜色方案时，这意味着“不允许颜色方案 - 东西可能会坏！” 换句话说，它告诉浏览器坚持其传统的样式模式。
此外，这还没有在浏览器中实现。 WebKit 实现具有
auto值，但它有所不同 - 它会参考元标记中设置的值。forced-color-adjust这不会影响常规的颜色方案偏好，因为默认情况下，作者样式会覆盖浏览器样式。 这专门针对“强制”方案，例如 Windows 高对比度模式。 我们正在标准化 WHCM 的工作方式，将其定义为
revert操作，该操作会回滚作者样式，以便浏览器样式适用。forced-color-adjust: none会取消对专用元素的回滚，如果作者已经在使用反映用户颜色方案和对比度偏好的样式。同样，它还没有在浏览器中实现，尽管 IE/Edge 对使用其带前缀的媒体查询设置的样式具有类似的行为。 请参阅 Eric Bailey 关于将其用于 SVG 的文章 以了解示例。
最后
在规范上有许多 开放问题。 但是，浏览器对规范和发布此规范有很大兴趣。 CSS 工作组将在下周开会，我们将尝试解决许多问题。 如果人们有意见或建议，现在正是时候发表意见了！