✏️ AI 术语图鉴

深色模式 · Dark Mode

英文:dark mode按单词直读

界面与交互难度:进阶 ★★

🗣️一句话大白话

网站的「夜间皮肤」:深底浅字。正确实现方式是「颜色全走设计变量」,切换时整套换——先定变量的项目,加深色模式只要一小时。

🎬真实场景

用户说「加个深色模式」,AI 把所有色值手写反转——浅色模式坏了。正确做法:色值定义成变量(--bg、--text),深浅两套值,一键切换。

📮你可以这样说

「支持深色模式:所有颜色用 CSS 变量定义,浅/深两套值,默认跟随系统偏好,并提供手动切换开关(记住用户选择)。」

⚠️边界与常见误解

  • 深色模式不是「颜色反转」:图片、阴影、对比度都要单独调
  • 跟随系统 + 手动覆盖两者不冲突,都要有
  • 上线前两套模式都过一遍:深色下的浅色图片会晃眼

🔗相关术语