# 超越浅色/深色配色方案的颜色定义 **URL:** \ **Category:** Support\ **Created:** [2024年一月5日 14:04 UTC](https://meta.discourse.org/t/color-definitions-for-more-than-light-dark-color-schemes/290631 "2024-01-05T14:04:39Z")\ **Posts on this page:** 1\ **Showing post:** 2
**Author:** ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don)\ **Post date:** [2024年一月6日 09:12 UTC](https://meta.discourse.org/t/color-definitions-for-more-than-light-dark-color-schemes/290631/2 "2024-01-06T09:12:53Z")
你好 👋 Discourse 支持两种配色方案：浅色（Light）和深色（Dark）。因此，当您将设备切换为深色模式时，它将默认使用 `default dark mode color scheme id` 站点设置。 您可以为 Discourse 设置更多自定义调色板。 您可以在 `/admin/customize/colors` 页面中设置新的调色板。 或者 例如，如果您使用自定义主题，则可以在 `about.json` 文件中设置这些内容。例如，我们在 FKB Pro 主题中就是这样做的。 > 在这种情况下，这些调色板将添加到 `/admin/customize/colors` 中。 * * * 当添加了这些调色板后，如果启用了该功能，用户可以在用户偏好设置界面中选择它们。 ![Screenshot 2024-01-06 at 9.43.56](https://global.discourse-cdn.com/meta/original/4X/9/3/1/931238cc54921cd11b6d3c00c7b9bc9c9e074d04.png) * * * `dark-light-choose()` `dark-light-choose()` 只能处理两种配色方案：浅色/深色，而不能处理调色板。我建议仅使用它来创建自定义颜色变量，而不是覆盖默认变量。要覆盖默认颜色变量，您可以按照上面所示进行操作。 如果用户在用户偏好设置界面中选择了不同于站点默认浅色/深色的其他调色板，那么它将使用您通过 `dark-light-choose()` 创建的颜色变量，应用于所有浅色或深色配色方案的调色板。 这也是我制作以下 #Customization > Theme component 的原因之一。 > [@可目标的色彩方案](https://meta.discourse.org/t/targetable-color-schemes/276967?u=don): > > information_source摘要 为 HTML 添加颜色方案属性hammer_and_wrench代码库 [GitHub - VaperinaDEV/targetable-color-schemes: This theme component adds the current color scheme attribute to html.](https://github.com/VaperinaDEV/targetable-color-schemes)question安装指南 [如何安装主题或主题组件](https://meta.discourse.org/t/how-do-i-install-a-theme-or-theme-component/63682)open_book刚接触 Discourse 主题？ [Discourse 主题使用入门指南](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) Install this theme component Hello wave This theme component adds the color-scheme="id" attribute to the \ tag. This attribute contains the current color scheme id. Like this, you can make (CSS, Javascript) ch… 在该主题组件中，您可以单独针对 `color-scheme="id"`。 > 因此，您可以这样做 🔽 > > 创建调色板（浅色、柔和、深色） > > 使用上述组件对柔和 `color-scheme="id"` 的颜色或其他内容进行修改，如有需要。 --- _[View the full topic](https://meta.discourse.org/t/color-definitions-for-more-than-light-dark-color-schemes/290631)._