客户端黑白风格颜色使用指南

一 背景颜色

用面与面来区别各个组件之间的不同，通常会找一个跟背景色相差无几，稍微深一点或者浅一点的颜色。这个颜色唯一的功能就是告诉人们这两个区域是不同的，仅此而已。
下面推荐集中颜色：

为了不抢占人们太多注意力，在白色的背景上一般用非常浅的灰，深色背景上用的则是比背景色稍浅或者稍微深一点的灰。

颜色对照表： https://tool.oschina.net/commons?type=3
颜色选择网站： https://flatuicolors.com/

二 字体、内容颜色

UI中文字的层级关系，除了用字号字体和间距来表达外，最常用的一种就是通过颜色的对比了。而这种对比跟上面用来布局的遵循的原则完全相反。上面的色彩对比是越小越好。而文字的层级关系上色彩的差别越大则层级关系越清晰。除此之外它们都需要跟背景有相对高的对比，否则会影响文字的阅读。

三 其他配色

黑白灰基本上可以和任何一种颜色和谐相处。大部分的UI配色都是黑白灰+一个主色+一个辅助色。

在黑白灰的基础上添加了些许的色彩，例如推特这种，主色调是蓝，无论是背景还是文字，都其实是一种饱和度极低的蓝。

这里说一下，Facebook 界面的主色调貌似也是选择蓝色。

四 拓展内容 — 蓝色界面风格

蓝色是 UI 设计中最重要的颜色之一，也是其中最常见的。看看你的智能手机应用程序图标，你会看到很多都是蓝色的：Facebook，Twitter，Shazam，Safari等。（国内有知乎、支付宝、钉钉、App Store等）

为什么都选择蓝色？原因？

1、蓝色是代表科技感的颜色

led发光种，红绿蓝、蓝色led是最后被发明的，在历史上曾具有科技性的代表，且赋予创新意识。所以，通常科技类公司喜欢使用蓝色，因为它与技术和创新相关。

2、人们喜欢这种颜色。

调查显示，大多数人将蓝色视为最喜欢的颜色（一半以上男人喜欢蓝色，三分之一以上女人喜欢蓝色）。蓝色被认为是全球最安全的颜色。

3、让人感到安全。

蓝色是旅游行业网站和应用程序的常见颜色。它代表可靠性，这对旅游公司来说是件好事。

4、无障碍。

最常见的色盲症（红绿色盲）可以看到蓝色。但对于绿色或红色的颜色来说，很难识别。