各位设计师平时在编写App GUI规范时，是否因为给颜色定规范而头疼呢，特别是遇到需要换肤这个头大的问题！

下面我给大家分享一下我平时工作中的一些经验吧：

首选把主要的颜色定下来是最基础的部分

1.首先是文字的颜色（避免纯黑#000000）尽量混合一点app的主色；副标题的颜色稍微比标题文字在视觉上更接近承托的背景色一点，这样视觉层级上会有一个递进的关系。

2.白天的颜色肯定很好确定的，夜间模式的颜色其实找到规律也是很好确认的哦；

首先夜间模式的颜色肯定是没有标准的定义，首选确定好背景的颜色；一般可确定两种背景的颜色：

背景的颜色也需要避免纯黑（#000000），也一样的可尽量混合一点app的主色（为了最后出来的效果和谐，浑然天成）。

3.剩下的就是确定交互主色，这里一般都是用的app的主色：

一般情况夜间模式下颜色一样即可，有一种情况例外：app的主色颜色较深，在夜间模式下对比度不是很高，导致很难识别；这种就要提高主色的明度和饱和度来增加对比度。

4.其次就是交互控件未选中的颜色：

5.确定好这些颜色就算完成55%了，剩下的就是根据业务和设计风格而增加的一些颜色了。。。

6.所有颜色确定好之后给每一组颜色一个对应的编号，例如下图：

***不同的功能或控件只要是颜色相同，都可以用同一组颜色搞定，避免产生过多的颜色导致使技术在开发时混淆用错；

有了对应的编号后，让开发写到库里面自动映射就好了；这样的好处是尽管后面需要大面积更改app的颜色时，只需要在库里面改掉对应的色值即可全局更改；

7.根据业务场景的不同，最好不要把其他功能和主色混着用，例如我们的产品是交易所，如果把涨跌的颜色与主色重复着用，切换涨跌色的时候势必会有影响，所以如下图，我们把涨跌色单独提出来分组：

以上就是本次分享的一些经验，有不足的地方希望指出，大家一起交流学习，谢谢！

---------------------------------------------------------------

下次分享APP弹框相关的经验。

Powered by Froala Editor