01 功能说明
调整深色调色板，包括层级、对比度、媒体处理和主题选择行为。
Dark Mode Design 从现有的浅色调色板入手。它使用逐级变亮的深色表面来表达层级，并针对新背景调整明亮色彩、文本、边框和状态样式。
来源还涵盖图像、插图、徽标、系统配色方案偏好和手动切换功能。其中的数值颜色示例仅供参考，并非通用值。必须在真实组件以及用户实际看到界面的条件下检查设计。
预期交付成果
识别现有的语义颜色和组件层级。
采用经过设计的亮度层次和调整后的强调色，而不是直接反转颜色。
检查组件对比度、徽标、图像、自动偏好设置和手动主题选择。
02 适用场景
从现有的浅色模式调色板、组件示例和媒体资源开始。使用渲染后的界面检查深色模式对比度、主题切换和图像处理。
03 关键决策
当深色阴影失效时，表面亮度可以传达层次关系。
过于明亮的图像或不合适的徽标，可能破坏原本协调一致的深色界面。
04 示例任务
以下示例简报尚未经过测试。使用前请检查该技能的设置说明。
从 designer-skills 仓库将此任务的 SKILL.md 加载到代理支持的技能位置。入口文件并未规定通用的安装命令。
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/ui-design/skills/dark-mode-design/SKILL.md从现有的浅色模式调色板、组件示例和媒体资源开始。使用渲染后的界面检查深色模式对比度、主题切换和图像处理。
运行该技能前，请调整此简报中的范围、来源材料和约束条件。
使用 dark-mode-design 调整这个现有的浅色仪表板。对表面和文本进行语义映射，审查警告色和图表图像，并定义系统偏好设置及手动选择方式。测量实际的颜色对比组合，并标记需要深色版本的资源。根据以下可观察标准检查实际输出。
OpenDesign 为编码代理提供本地设计工作区。此条目并不意味着该技能已捆绑提供，也不意味着其外部工具、凭据和软件依赖项包含在内。
05 来源与许可证
本页描述下方链接所指向的固定来源版本。上游行为和要求可能发生变化。
9a6930cf84a8调整深色调色板，包括层级、对比度、媒体处理和主题选择行为。
由 OpenDesign 根据所链接来源撰写的原创摘要。仓库星标数是带日期的受欢迎程度指标，并不代表技能使用量或质量评分。
06 开始前的问题
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/ui-design/skills/dark-mode-design/SKILL.md