1.1　色彩的基础理论

色彩作为一种最普遍的审美形式，存在于日常生活的方方面面，人们的衣、食、住、行、用都与色彩有着密切的关系。色彩带给人们的魅力是无限的，是人们感知事物的第一要素。色彩运用对于艺术设计来说起着决定性作用。

1.1.1　认识色彩

人们的日常生活中充满了各种各样的色彩，无论是平常所看到的还是碰触的东西，全都存在着色彩，既有难以感觉到的，也有鲜艳耀眼的。其实这些色彩都来自于光的存在，没有光就没有色彩，这是人类依据视觉经验得出的一个最基本的理论，光是人们感知色彩存在的必要条件。

色彩是由于物体能有选择地吸收、反射或折射色光所形成的。光线照射到物体之后，一部分光线被物体表面所吸收，另一部分光线被反射，还有一部分光线穿过物体被透射出来。也就是说，物体表现出什么颜色就是反射了什么颜色的光。色彩就是在可见光的作用下产生的视觉现象。

从人类的视觉经验可知，既然光是色彩存在的必备条件，那么就应当了解色彩产生的实际理论过程。图1-1所示为色彩产生的过程示意图。

1.1.2　色彩三要素

世界上的色彩千差万别，几乎没有两种完全相同的色彩，但只要有色彩存在，每一种色彩就会同时具有3个基本属性：色相、明度和饱和度，它们在色彩学上被称色彩的三要素或色彩的三属性。

1．色相

色相是指色彩的相貌，是一种颜色区别于另外一种颜色的最大特征。色相体现着色彩外向的性格，是色彩的灵魂。色相是由射入人眼的光线的光谱成分所决定的。

在可见光谱中，红、橙、黄、绿、蓝、紫，每一种色相都有各自的波长与频率，它们从短到长按顺序排列，就像音乐中的音阶顺序一样，秩序而和谐。光谱中的色相发射着色彩的原始光，它们构成了色彩体系中的基本色相。图1-2所示为12基本色相环。

2．明度

明度是眼睛对光源和物体表面的明暗程度的感觉，主要是由光线强弱决定的一种视觉经验。

在无彩色中，明度最高的色彩是白色，明度最低的色彩是黑色。在有彩色中，任何一种色相中都包含明度特征。不同的色相其明度也不同，黄色为明度最高的有彩色，紫色为明度最低的有彩色。任何一种颜色加入白色，都会提高明度，白色成分越多，明度越高；任何一种颜色加入黑色，都会降低明度，黑色成分越多，明度越低，如图1-3所示。

◆　案例分析

在UI配色设计过程中，可以通过调整界面中设计元素的色彩明度差异，使界面中的重要信息或功能操作按钮在界面中凸显出来，这样能够有效增强界面的视觉层次感，如图1-4所示。

3．饱和度

饱和度是指色彩的强度或纯净程度，也被称为纯度、彩度、艳度或色度。对色彩的饱和度进行调整，就是调整图像的彩度。饱和度表示色相中灰色分量所占的比例，它使用0%（灰色）～100%来度量，当饱和度为0时，则会变成一个灰色图像，增加饱和度会增加其彩度。

某种色相的颜色在没有掺杂白色或黑色时，被称为“纯色”，如纯红色、纯蓝色等，在“纯色”中加入不同明度的无色彩，就可以得到不同饱和度的该色相色彩。以红色为例，在纯红色中加入少量白色，饱和度下降，而明度提升，变为淡红色。继续增加白色的量，颜色会越来越淡，变为淡粉色；如果加入黑色，则色彩的饱和度和明度同时下降；如果加入灰色，则会使色彩失去光泽。图1-5所示为色彩饱和度变化示意图。

◆　案例分析

图1-6所示为一款移动App界面设计，使用高饱和度色彩进行配色设计，使界面中的图形效果表现突出、清晰，高饱和度的色彩搭配非常耀眼，能够为用户带来热情、欢乐的情绪。如果降低界面色彩的饱和度，虽然界面中的信息内容依然表现清晰，但是界面显得发灰，色彩的对比度不够强烈，给人一种灰蒙蒙、不清晰的感觉。

1.1.3　无彩色与有彩色

色彩可以分为无彩色和有彩色两大类。无彩色包括黑色、白色和灰色，有彩色包括红色、黄色、蓝色等除无彩色以外的任何色彩。有彩色具备光谱上的某种或某些色相，统称为彩调。相反，无彩色没有任何彩调。

1．无彩色

无彩色是指黑色和白色，以及由黑、白两色混合而成的各种灰色，其中黑色和白色是单纯的色彩，而灰色却有着各种深浅的不同。无彩色系的颜色只有一种基本属性，即“明度”。

无彩色系的色彩虽然没有彩色系那样光彩夺目，却拥有彩色系无法代替的重要作用。在设计中，合理的无彩色搭配同样可以使UI表现出独特的视觉效果。

◆　案例分析

无彩色在移动App界面设计中比较常用，特别是一些电商类App界面，通过无彩色的搭配能够有效凸显界面中产品图片的表现效果。图1-7所示是一个电动滑板车App界面设计，完全使用无彩色进行搭配，黑色的背景搭配白色的产品信息卡片，层次非常清晰，无彩色的搭配使产品显得更加高档。

图1-8所示是一个数码产品网站UI设计，使用不同明度的灰色进行搭配，背景的浅灰色与相机的色彩相呼应，给人一种精致而高档的感受。在界面局部点缀少量的红色，以突出重点信息的显示，也很好地打破了界面的沉闷感。

2．有彩色

无彩色以外的所有色彩都属于有彩色系，有彩色系包括基本色、基本色之间的混合色或基本色与无彩色之间不同量的混合色等，它们都属于有彩色系。

有彩色系中各种颜色的属性都是由光的波长和振幅所产生的。有彩色系色彩包含色相、明度和饱和度3个属性。

◆　案例分析

图1-9所示是一个与动物相关的App界面设计，使用低明度的深蓝色作为界面背景颜色，而界面中不同的动物图片使用了不同高饱和度的有彩色背景，并且功能操作图标也使用了高饱和度的绿色进行搭配，与界面背景形成强烈对比，有效突出了动物图片和主要功能的表现，界面中信息内容的层次感比较突出。

图1-10所示是一个牙膏产品宣传网站UI，使用不同明度的高饱和度洋红色作为主色调，表现出柔美、温馨、浪漫的氛围，并且能够与蓝色的产品形成强烈的视觉对比，界面的视觉表现力更强。