色彩是设计师的灵魂，它激荡着无穷的创意与灵感，让我们的世界变得更加丰富多彩。我的铁汁们，最慢的脚步不是跬步，而是徘徊；最快的脚步不是冲刺，而是坚持。希望我们一起进步
我们为什么从色彩构成开始说。我是觉得使用要从最底层的了解开始。这样我们在看到优秀的配色或者规范时才能明白他是怎么搞出来的。
色彩构成是艺术设计的基础理论之一，也是构成基础训练的重要组成部分。全面、系统地学习掌握色彩构成及其形式法则，可以以独特的视角认识世间万物的色彩，提升我们的色彩感觉、敏锐度和审美，并从美学的角度运用色彩。
色彩构成作为现代艺术设计基础的重要组成部分。我想大部分的设计师应该是都学习过的。当然他是包含很多的内容的、这里我们只找一部分我们都用的上的来重温一下。没有学习过的小伙伴也可以了解一下。
官方的色彩构成解释很复杂，我感觉我自己看不懂。结合官方的定义我理解的色彩构成就是。首先是构成、就是放在一块。色彩构成就是把两种或两种以上的色彩放在一块。当然肯定不能随便把色彩放在一块。我们是有目的的根据人们对色彩的感知和心理反应把他们放在一块。来达成我们的目的。
百度的定义是：色彩构成（InteractionofColor），即色彩的相互作用，是从人对色彩的知觉和心理效果出发，用科学分析的方法，把复杂的色彩现象还原为基本要素，利用色彩在空间、量与质上的可变幻性，按照一定的规律去组合各构成之间的相互关系，再创造出新的色彩效果的过程。色彩构成是艺术设计的基础理论之一，它与平面构成及立体构成有着不可分割的关系，色彩不能脱离形体、空间、位置、面积、肌理等而独立存在。
光色并存，有光才有色。色彩是离不开光的。有了光便有了色，是的我们所看到的色是从光里来的。我们之所以能看到五颜六色的世界全是从光里的来的。所以看似稀松平常的光是怎么分裂出来颜色的呢。
白光是由红、橙、黄、绿、蓝、靛、紫等各种色光组成的。白光散开后单色光从上到下依次为“红、橙、黄、绿、蓝、靛、紫七种颜色。色散可以利用三棱镜或光栅等作为“色散系统”的仪器来实现。光的三基色：红，绿，蓝
在我国从晋代开始，许多典籍都记载了晶体的色散现象。如记载过孔雀毛及某种昆虫表皮在阳光下不断变色的现象，云母片向日举之可观察到各种颜色的光。
是眼睛对光源和物体表面的明暗程度的感觉，主要是由光线强弱决定的一种视觉经验。一般来说，光线越强，看上去越亮；光线越弱，看上去越暗。
明度也指颜色的明暗程度。色调相同的颜色，明暗可能不同。例如，绛红色和粉红色都含有红色，但前者显暗，后者显亮。
是指色彩的鲜浊程度。纯度较高的颜色，如果与同明度的灰色混合，则可以构成同色相、同明度、不同纯度的颜色序列。任何一种具有色相的颜色，混白、混黑、混灰、混补色都会降低其纯度，混入的越多，纯度降低得越多。
饱和度是色彩的3个属性之一，另外两个属性为色相（hue）和明度（value）；在此模型下色相的取值范围为0°到360°，饱和度和明度取值范围为0到100%。在色彩学中，原色饱和度最高，随着饱和度降低，色彩变得暗淡直至成为无彩色，即失去色相的色彩。作为信息的载体，色彩不仅依附于设计形式，还作为一个主体来完成信息传达的过程。对于艺术设计来说，色彩的运用与设计是其重要的部分，在实际应用中，依据饱和度高低值将色彩分为低饱和度对比、中饱和度对比和高饱和度对比3个基本种类以及饱和度组合对比一个衍生种类。
认识色彩关系色彩关系是非常关键的。同类色：同一色相中不同倾向的颜色称为同类色。对比色：在色环上任一直径两端相对的颜色称为对比色。互补色：如果两种颜色混合后形成中性的灰黑色，这两种颜色称为互补色。如黄与蓝、青与红等。
不同频率色彩的光信息作用于人的视觉器官，通过视觉神经传入大脑后，经过思维，与以往的记忆及经验产生联想，从而形成一系列的色彩心理反应。
色彩本身并无冷暖的差别，只是我们的视觉被色彩影响。是我们心里联想了场景，进而产生了冷暖感觉。
-暖色
人们见到红、红橙、橙、黄橙、黄、棕等色后，会联想到太阳、火焰、热血等物像，产生温暖、热烈、豪放、危险等感觉。
-冷色
见到绿、蓝、紫等色后，则会联想到天空、冰雪、海洋等物像，产生寒冷、开阔、理智、平静等感觉。
色彩的联想带有情绪性的表现。受到观察者年龄、性别、性格、文化、教养、职业、民族、宗教、生活环境、时代背景、生活经历等各方面因素的影响。
各种色彩都其独特的性格，简称色性。它们与人类的色彩生理、心理体验相联系，从而使客观存在的色彩仿佛有了复杂的性格。
为了更准确的描述颜色，工程师们引入了色彩模型的概念：将色彩拆分成不同属性并进行量化，通过计算机语言更科学准确的表述颜色，而不同维度的拆分方法便是色彩模型。随着科技发展和生产制造的需要，色彩模型迭代出了多个版本类型。
HSB模型也称HSV模型，该模型是建立在人眼识别色彩的基础上，符合人类日常的生活经验，相较其他模型最为直观易理解。该模型主要使应用在图像处理、计算机图形学、色彩管理等领域，用于描述和操作颜色。其属性包括：
HSL是和HSB原理相同的模型，在工作中很容易会被混淆使用，其区别在于：HSB中B指的是【亮度Brightness】，而HSL中L指的是【明度Lightness】。为方便大家理解，对于这两种模型的详细区别。
HSB和HSL模型在使用场景上都是用于软件开发应用，在实际工作中我们接触HSB模式的场景会更多，但到底哪种模型更适合人类用户使用的界面设计尚未有定论。对于设计师自身而言需要注意的是，在和开发同步设计资料时确保使用的是同一种模型，避免产生颜色误差。
虽然HSL模型有诸多好处（HSB、HSL属于同类模型，后文统一用HSL概括），但其缺陷也很明显：HSL模型无法用于工业制造，因为在自然界中基本很难找到某一属性纯度可以达到标准的物体，也难以控制单一属性变量来改变物体颜色。为了解决以上限制，用于屏幕显示的RGB模型和彩色印刷的CMYK模型应运而生。
RGB模型是依据颜色发光的原理所搭建的，也被称为光的三原色，工业上用于通过红、绿、蓝三色发光单元产生颜色的电子屏幕。
R红：Red，以数值（0-255）表示。
通常情况下，RGB各有256级亮度，用数字表示为从0、1、2…直到255，虽然数值最高是255，但0也是数值之一，因此共256级。将三种颜色叠加并控制其颜色强度，256级的RGB色彩总共能组合出上千万种色彩，而这个标准几乎包括了人类视力所能感知的所有颜色，是目前运用最广的颜色系统之一。
关于HEX色值
这里还有个知识点就是HEX色值，听到它大家都不会陌生，在很多拾色器中我们都见到过，工作中也经常将其提供给开发同学作为颜色标识。
虽然看起来结构不同，但HEX也是采用RGB模型的原理来定义颜色，只是语言上用的是十六进制代码：字节值范围从0到FF，颜色的最低强度为00，而最高强度为FF。实际转换时，每位数字范围是0～15（分为0～9和A～F，其中A～F表示10～15），这样每位数字都能代表16个数，而每2位数字相乘即可代表256级，正好对应一个颜色通道。
相较于长段的RGB表示法，HEX色值表示法只需六位字符，更加紧凑轻量，所以更适合开发人员使用。
以上RGB模型是针对可自身发光的物体，CMYK模型则是针对依靠反光的物体。CMYK是色料的三原色，也叫印刷的三原色，使用最多的场景是媒介印刷，其原理是基于油墨的光吸收/反射特性，眼睛看到颜色实际上是物体吸收白光中特定频率的光而反射其余光得来。
当然其实还有很多其他的颜色模型比如灰度、Lab等这里就不做过多介绍了。
上面我们了解了颜色。下面我们就来看看。国内大厂他们中后台设计规范里。颜色规范是怎么怎么定义的。毕竟我们跟随这他们的脚步不说超越他们。至少能够提升我们的效率不掉队。也许他们的方案在我们现在项目里可能并不能够适用。但我们也要知道，那些是能够让我们走向更好的道路。
一般会选择品牌色或者行业色。品牌色是体现产品特性和传播理念最直观的视觉元素之一。在色彩选取时，需要先明确产品的品牌色。如果已经有了品牌色。那就可以考虑用自己的品牌色为主色去搭建一套自己平台的颜色规范。如果没有品牌色、那么考虑搞一个品牌色。品牌色的选取一般根据业务属性与产品性格进行选取。需要设计师了解产品所属领域、产品定位、目标受众群体等，以及我们的品牌色想传递给用户怎样的情感。当我们不知如何选取品牌色时可以先看看我们同业务属性的产品有哪些颜色。就是行业内其他同行在用什么色。我们能不能抄（呸、是借鉴）。
在UI设计中辅助色被作为功能色使用，功能色代表了明确的信息以及状态，比如成功、出错、失败、提醒、链接等。我们基于品牌色就衍生出了3个辅助色：1个类似色+2个分裂互补色。
下面我们就看看各大厂中后设计规范里怎么定义自己的颜色规范的。这里列举antdesign、TDesign、arcodesign、UDCDesign的颜色规范。
阿里的中台设计规范。这应该是国内早走的中后台设计规范了吧。做的各方面其实都还挺厉害的。现在已经更到5.0版本了。在他的设计规范里。对色彩的定义。将色彩体系解读成两个层面：系统级色彩体系和产品级色彩体系。系统级色彩体系主要定义了蚂蚁中台设计中的基础色板、中性色板和数据可视化色板。产品级色彩体系则是在具体设计过程中，基于系统色彩进一步定义符合产品调性以及功能诉求的颜色。在应用上给了其它设计师sketch插件。不但可以使用AntDesign官方色板库，还可以管理自己的色板。还挺方便的之前我就用的这个。ant的颜色搞得还挺好看的。哈哈哈
-色彩空间
-功能色
功能色代表了明确的信息以及状态，比如成功、出错、失败、提醒、链接等。功能色的选取需要遵守用户对色彩的基本认知。我们建议在一套产品体系下，功能色尽量保持一致，不要有过多的自定义干扰用户的认知体验。
-中性色
AntDesign的中性色主要被大量的应用在界面的文字部分，此外背景、边框、分割线等场景中也非常常见。产品中性色的定义需要考虑深色背景以及浅色背景的差异，同时结合WCAG2.0（内容无障碍指南、感兴趣的小伙伴可以去百度一下。还挺有意思的）标准。
TDesign的色彩体系搭建遵循了TDesign包容、多元、进化、连接的价值观，充分考虑色彩的应用需求，符合无障碍标准，提供了一套定义完整、开箱即用的官方色板。
在TDesign色彩系统中，每个功能色扩展10级色阶，足够覆盖界面设计中各需求场景。色阶的制定采用了HCT色彩空间，结合不同色相下饱和度及亮度插值拟合出优化曲线，保证色彩变化均匀，多色之间亮度均等。
在阿科design的设计规范里并没对颜色规范做过多的说明。因为他们在自己的设计组件里内置了。一套符合人眼视觉的色彩算法。如果你直接使用他们的设计组件的话就比较爽了。
还给提供了一个实用工具。
大概你也会在项目里遇到各种问题。明明用的大厂的设计组件和规范。明明站在了巨人的肩膀上我们怎么还是做不好。做不出牛X的界面视觉和交互呢。其实问题是出在多个方面的。问题最终的锅也不全是设计师的。会有多种多方面的原因导致我们最终上线的系统并没有那么好。
线上总是没有设计稿优秀。设计稿总没有自己想的美。影响项目的原因我会在另一复盘系列吐槽。哈哈这里就赘述了。
那天一个美女设计师说。这些基础的知识没啥用。不用知道这些也可以做项目。嗯。她说的可能没有错。不用栅格也可以做界面。不了解色彩也可以做界面。那我们还为什么了解呢。