如何在用户的浏览器Chrome中找出颜色主题？

问题描述

Google Chrome 能够应用颜色主题。同时，对界面进行了绘制。我希望浏览器扩展的部分界面继承这种颜色？告诉我，可能吗？有没有办法确定Chrome界面的颜色？对于网站，对于扩展程序？

解决方法

您可以使用 CSS 媒体查询 prefers-color-scheme 根据用户的配色方案应用不同的样式。

fieldset {
  background-color: gainsboro;
}
@media (prefers-color-scheme: dark) {
  fieldset {
    background-color: darkslategray;
  }
}

查看 https://web.dev/prefers-color-scheme/#the-prefers-color-scheme-media-query 了解更多详情、提高加载性能的方法等！

PS：大多数常绿浏览器都支持 prefers-color-scheme 媒体查询。