△ 不同重要级和不同大小的文本在整个UI中传递出了层次结构，这个原理也适用于深色主题。
2. 注意对比度
所有的文本内容应该易于阅读并符合标准规范。网页标准 WCAG 2.0 中规范 AA 级别的文本，普通文本与背景之间的对比度为 4.5 : 1，大标题文本这个比例为 3 : 1。
在我们的 App 中，直接把浅色背景下的标签颜色带到深色模式中，文本开始变得很难阅读。为了得到一个好的对比度，所有的标签文本需要修改到深色，识别度会更高。
△ 彩色元素上的文本需要改变颜色以保证易读。
谷歌做了一款测试工具，帮助确定在哪个颜色值时需要将白色文本改为黑色文本，工具的地址在（https://material.io/design/color/the-color-system.html#tools-for-picking-colors）
（彩云注：彩云亲测，还挺方便使用的，建议用电脑端打开这个页面试用一下，对于配色纠结症患者，有良好的治愈效果。）
小建议：推荐一款在 sketch 和 Adobe XD 中使用的小插件叫 Stark，可以方便的测试出你设计的界面可用性。
插画和动效
如果应用包含插画和图形元素，这些也需要做好深色适配工作。
如果插画有「背景」和「主题」，最好是将背景的饱和度降低，以保证对于主题的关注。
Lottie 动画可以通过在 AE 中的源文件来重新导出 json 文件，来调整动画的明暗适配，很方便。
△ 深色主题插画同样让用户关注到插画的主题内容。
总结
随着深色主题被引入操作系统级别，应用将需要在不破坏任何原有体验的情况下做出适配优化。
深色主题并不是仅仅做简单的反色。
设计师和开发者必须明确以下几点：
- 所有的 UI 元素必须符合标准的可用性原则；
- 组件的可视层次结构在不同的颜色主题内应该是保持一致的；
- 品牌识别不应该受到主题颜色变化的影响。
原文：https://medium.com/snapp-mobile/design-for-the-dark-theme-9a2185bbb1d5
作者：Pierluigi Rufo
译者: 彩云Sky
