SuperAPI AI 工具集

dark-mode

前端与建站

查看项目

更新于 10-16 05:44

技能介绍

用途:为一个已有的浅色主题生成对应的深色模式配色变体,目标是在切换深色模式后仍保持与浅色主题相同的对比度和视觉层级,而不是简单地把颜色反转。

主要能力:按规则重新分配颜色职责。表面色使用品牌色板的深色区间(800-950);文字使用浅色区间(50-200);强调色在必要时调整明度以维持对比度;减少高度层级(elevation)差异,因为阴影在深色背景上不易看见,改用表面色明暗变化来表达层级;减少纯白使用,改用偏白(off-white)。

使用方式:生成结果以 @media (prefers-color-scheme: dark) 媒体查询输出,覆盖浅色主题中定义的 CSS 自定义属性,从而让浏览器在用户系统偏好为深色时自动应用。

适用场景:需要为已有浅色主题快速补一套可用深色配色方案的前端或设计工作流。

限制:资料未提供具体色板数值、完整实现步骤、依赖工具、平台支持范围与价格信息,暂未提供。