设计中实用的配色

01认识颜色

色彩构成（Interaction of color），可以理解为色彩的作用，是在色彩科学体系的基础上，研究符合人们知觉和心理原则的配色。 配色有三类要素:光学要素(明度、色相、纯度)，存在条件(面积、形状、肌理、位置)，心理因素(冷暖、进退、轻重、软硬、朴素华丽)，设计的时候运用逻辑思维选择合适的色彩搭配，产生恰当的色彩构成。 最优秀的配色范本是自然界里的配色，我们观察自然界里的配色，通过理性的提炼最终获得我们所需要的东西。 下面是我们设计中常用的两种设计软件里对颜色的不同模式，手机端常用的为RGB模式，物料印刷为CMYK模式,今天我会着重讲RGB模式下的配色方案，后期等自己能够把物料摸透了，再继续更新物料这个领域。

RGB模式  

RGB色彩就是常说的三原色，R代表Red（红色），G代表Green（绿色），B代表Blue（蓝色）。 之所以称为三原色，是因为在自然界中肉眼所能看到的任何色彩都可以由这三种色彩混合叠加而成，因此也称为加色模式。 RGB模式又称RGB色空间。 它是一种色光表色模式，它广泛用于我们的生活中， 图 像如用于电视、幻灯片、网络、多媒体。

互补色  

当两个颜色在伊登的色环上，在色相环中的夹角为180°时，这两个颜色互为补色，也就是“互补色”。 搭 配在一起，可以打造活力四射的强烈视觉效果，特别是在颜色饱和的度最大的情况下。 一般在水彩或者油画里物体的反光会用到对互补色，这是光的视觉原理形成的， 在UI设计领域适合用来做警示提醒。

近似色  

即伊登色环上任意相邻的三个颜色，又或者是同一色相的三种不同明暗度。但必须同是冷色类或者暖色类。比如绿色和青色。 搭配在一起，可以打造出一种和平而又可爱俏皮的印象，在UI设计领域适合在选定主色后，进行辅助色搭配。

市面上一些橙色的产品，橙色富于母爱或大姐姐的热心特质、给人亲切、坦率、开朗、健康的感觉； 介于橙色和粉红色之间的粉橘色，则是浪漫中带着成熟的色彩，让人感到安适、放心，但若是搭配不好，便显得俗气。 适用的领域购物、游戏、直播视频、理财、学习、运动、美食。

02实操案例

定主色  

就拿最近一直在跟的 一个小程序为例，“好享家会员中心”，主要就是做金融会员这块，当 时在定主色的时候，有两个主色可选，一个是橙色，一个是蓝色，考虑橙色的原因是想 延着公司品 牌橙色这个方向走； 考虑蓝色是因为用户对象都是老板级别的，需要给用户一种信 任 、安全，从用户角度出发，蓝色就最终胜出。

定辅助色  

主色确认之后，就开始定辅助色、提示色，也查阅一些怎么定辅助色的方案，主要目的就为了保证他们一起搭配时，视觉能够更和谐。

  字体色值  

对于APP设计这块，我们还会注重字体的色值、大小，字体色值决定了页面阅读的舒适性，这方面如果没有做好的话，会给用户造成阅读及交互障碍，影响产品的功能性，我这边的字体配色是有一定的阶梯性，让页面层级看起来主次分明。

这里面我会借用一个配色网站、根据产品的页面属性对颜色进行筛查排除。

设计 成果  

展示几个主要的页面，还有很多需要优化上升的空间，后期会继续优化。

03提取自己的色卡

除了借助网站的配色辅助，我们还可以去找一些好看的实物照片提取配色方案，或者找一些好看的配色卡、优秀的视觉稿、成熟的插画案例，尤其是对于插画这块，这方面超级实用，下面是自己整理的一些优秀案例，希望对大家有所帮助跟启发。

有了色彩，人们的视觉才会丰富多彩，在生活中，在我们工作休暇之时，善于去发现美，善于去观察美，让繁忙的自己能在工作之余，试着去享受生活，释放压力，提高生活品质，提高精神层面，当你身边的美物越来越多时，你会发现你自己也会变得很美很优秀了，视觉审美也会随之提高，遇到一些你觉得不合理的地方时，你也可以用理论知识指点一二了，期待大家一起成长耶！