层级不能直接反色
浅色模式里靠阴影和白色差来区分层级，深色背景上阴影几乎看不见，白色差也会被压平，卡片和背景容易糊成一片。做法是改用背景明度差来分层，卡片比页面底色稍亮或稍暗一档。
层级一般控制在三到四档。底色、卡片、浮层、输入框各一档，超过四档就很难分辨哪一层在上面。每档之间的明度差要足够，肉眼能直接看出来才算有效。
纯黑和纯白都要慎用。纯黑背景在高对比屏幕上看久了容易疲劳，也放大了文字边缘的渲染问题；纯白文字在深色底上刺眼。用接近值替代纯色，通常更耐看。
切换模式后要重新检查间距和分割线。浅色下几乎看不见的分割线，在深色背景上会变成一条刺眼的白线，密度高的表格里尤其明显。
品牌色需要另配一套
品牌主色在浅色模式里对比度合适的，放到深色背景上往往偏暗，文字压在上面读不清。深色模式需要单独调一版，通常提高明度、降低饱和度。浅色页面上用作品牌强调的色块，在深色模式里往往需要改成一圈描边或者一段文字，直接沿用大色块会显得突兀。
不要把同一组色值在两套模式里硬套。语义变量分模式给值，按钮、链接、标签各自有一组深色下的取值，改动时也只需要动一处。状态色同样要重新校对。成功、警告、错误的绿黄红在深色下容易混在一起，尤其在低质量屏幕上。除了颜色，保留图标和文字，状态才不会被误解。
图片、图标与阴影
照片和插画在深色模式里往往显得过亮，形成刺眼的白色块。处理方式可以是降低亮度、加一层半透明遮罩，或者为关键位置准备深色版素材。不要对所有图片统一压暗，人物和商品图的观感会变差。
图标如果用的是深色描边，在深色背景上会直接消失。图标要跟随文字颜色使用语义变量，而不是固定色值。品牌 logo 需要单独准备深色版本。
阴影在深色模式下作用有限，替代方案是加一层极细的边框，或者提高卡片背景的明度。
用边框来表达边界，在这种场景下比阴影稳定。深色模式下宁可少一层效果，也不要靠微妙的明度差去区分层级。
切换与校验
同时支持跟随系统和手动切换时，要明确优先级。用户手动选过之后，系统变化不应该覆盖他的选择；同时提供一个回到跟随系统的入口，避免用户找不到退路。
切换的偏好最好本地保存，并与账号绑定同步，换设备后不会突然变成刺眼的白色。切换过程不要刷新页面，也不要出现明显的闪烁。切换前的首屏如果先按系统默认渲染再改样式，用户会看到一瞬间的白屏，脚本要在渲染前就把主题定下来。
最后逐页做对比度校验。把文字、图标、边框、禁用态、错误态都在深色下过一遍，重点看浅灰文字和数据表格，这两处最容易不达标。表格里的斑马纹和悬停色在深色下也要一并检查，它们最容易在切换后失去区分度。抽查截图在低亮度屏幕上看一眼，很多问题会直接暴露出来。
