下载掌阅APP，畅读海量书库
立即打开
以色相为基础的配色是以色相环为基础进行思考的，用色相环上类似的颜色进行配色，可以得到稳定而统一的感觉。用距离远的颜色进行配色，可以达到一定的对比效果。
色相配色在16色相环中，角度为0°或接近的配色，称为同一色相配色。角度为22.5°的两色间，色相差为1的配色，称为邻近色相配色。角度为45°的两色间，色相差为2的配色，称为类似色相配色。角度为67.5°～112.5°，色相差为6～7的配色，称为对比色相配色。角度为180°左右，色相差为8的配色，称为补色色相配色。如图2-1所示。
图2-1 色相差
色相差为0，色相环角度0°，为色相的不同明度或不同纯度变化的对比，俗称同类色组合。
如红色系中深红、朱红、橘红等色的组合，蓝色系中深蓝、湖蓝、浅蓝的组合等。同一色相的配色，色彩极易调和，但由于缺乏对比，容易产生单调感。因此，在配色时要注意加强各色彩之间的明度、纯度和色性的对比，使其在调和统一中求得明快对比的效果。
对于同一色相的配色，由于色相种类比较少，可以得到统一、文静、雅致、含蓄、稳重的效果，但也容易产生单调、呆板的缺点，我们可以通过明度和纯度的对比变化来达到平衡。如图2-2所示。
图2-2 同色相的配色
色相差为1，色相环角度22.5°，为弱对比类型。
对比效果：柔和、和谐、雅致、文静，但也感觉单调、模糊、乏味、无力，必须调节明度差来加强效果。
色相差为2，色相环角度45°，为较弱对比类型。
如图2-3所示，类似色相的配色，一般是在色相环上90°以内的色彩组合，如从红—橙—黄，从黄—绿—蓝绿，或从绿—蓝—蓝紫等。由于类似色相之间邻近，色彩逐渐变化，秩序性强，故色彩的组合配色十分协调，极容易形成统一的色调。并且与同一色相的配色相比又不乏色彩变化，其配色效果调和统一又清新明快。
图2-3 类似色相的配色
类似色相的配色，能表现共同的配色印象。这种配色在色相上既有共性又有变化，是很容易取得配色平衡的手法。例如：黄色、橙黄色、橙色的组合；群青色、青紫色、紫罗兰色的组合都是类似色相配色。与同一色相的配色一样，类似色相的配色容易产生单调的感觉，所以可使用对比色调的配色手法。
色相差为3～5，色相环角度67.5°～112.5°，为中对比类型。
对比效果：明快、活泼、饱满、使人兴奋，感觉有兴趣，对比既有相当力度，但又不失调和。中差配色的对比效果既明快又不冲突，是深受人们喜爱的配色。
色相差为6～7，色相环角度135°～157.5°，为强对比类型。
对比色的配色如从红—橙—黄—黄绿，从黄—黄绿—蓝—蓝紫等。它包含了中差色相配色、对照色相配色、补色色相配色。对比色相的色彩性质比较青，所以经常在色调上或面积上用以取得色彩的平衡。
对比效果：强烈、醒目、有力、活泼、丰富，但也不容易统一而感觉乱、刺激，造成视觉疲劳。一般需要采用多种调和手段来改善对比效果。
色相差为8，色相环角度180°，为极端对比类型，如图2-4所示。
图2-4 互补色之间的配色
如从红—黄—绿，从蓝—红—橙等，互补色之间由于色相对比非常大，除了调节各色相之间的面积、明度和纯度，经常使用间色或者无色系的色彩来起到平衡整体的作用。
如果我们同时用补色及类比色的方法来确定的颜色关系，就称为分离补色，如图2-5所示。这种颜色搭配既具有类比色的低对比度的美感，又具有补色的力量感，形成了一种既和谐又有重点的颜色关系。
图2-5 分离补色之间的配色
除了在一些儿童的产品中，三原色同时使用是比较少见的。但是，无论是在中国还是在美国的文化中，红黄搭配都非常受欢迎。红黄搭配应用的范围很广—从快餐店到加油站，我们都可以看见这两种颜色同时在一起。蓝红搭配也很常见，但只有当两者的区域是分离时，才会显得吸引人，如果是紧邻在一起，则会产生冲突感。原色色相配色如图2-6所示。
图2-6 原色色相的配色
全色相的配色是色相环上360°之间的色相配合，如图2-7所示。
图2-7 全色相的配色
包括了从红—橙—黄—绿—蓝—紫色相环上的全部色相。由于对比色、互补色和全色相配色在色相环上跨度大，色相多，可以形成冷暖对比、补色对比等对比强烈的色彩组合，其配色效果丰富多彩、醒目艳丽。
二次色之间都拥有一种共同的颜色—其中两种共同拥有蓝色，两种共同拥有黄色，两种共同拥有红色—所以它们轻易能够形成协调的搭配。如果三种二次色同时使用，则显得很舒适、吸引，并具有丰富的色调。它们同时具有的颜色深度及广度，这一点在其他颜色关系上很难找到。如图2-8所示。
图2-8 二次色的搭配
色相和色调（hue & tone）体系的最初来源是根据人的语言对颜色的描述：对偏白的颜色人们通常会使用“浅”、“柔”等形容词来描绘，而对作为三原色的红色（red）、黄色（yellow）、蓝色（blue）等颜色人们自然会联想到“鲜明”、“强烈”等形容词。而色调（tone—结合明度和纯度的概念）就是人们对可以利用同一形容词描述的颜色进行的汇总。
色相&色调体系是结合颜色的三种属性并根据人类心理的角度对颜色进行分类的科学的体系，它在很大程度上方便了用户对颜色的分类和使用。
图2-9是10色相环，图2-10为色调表，其中色调表示以红色为基准的。
图2-9 10色相环
图2-10 色调表
在色相和色调体系中，10种色相分别是指：红色（red）、橙色（yellow red）、黄色（yellow）、黄绿色（green yellow）、绿色（green）、青绿色（blue green）、蓝色（blue）、蓝紫色（purple blue）、紫色（purple）、紫红色（red purple）。
在色相和色调体系中，11种色调分别是指：鲜明（vivid）、高亮（strong）、明亮（bright）、清澈（pale）、苍白（very pale）、灰亮（light grayish）、隐约（light）、浅灰（grayish）、阴暗（dull）、深暗（deep）、黑暗（dark）。
其中“鲜明”和“高亮”色调的彩度很高，所以会给人一种华丽而又强烈的感觉；“清澈”和“隐约”的亮度和彩度都比较高，所以会给人一种柔和的感觉；“灰亮”和“浅灰”以及“阴暗”会给人一种朴素而又冷静的感觉；“深暗”和“黑暗”的亮度很低，所以会给人一种深沉而又凝重的感觉。
在色调表中，从下到上亮度依次增加，而从左到右彩度依次增加，所以在色调表中越靠上的颜色越亮，越靠右的颜色就越鲜明。如图2-11所示。
图2-11 具体色调表现
同一色调配色是将相同色调的不同颜色搭配在一起形成的一种配色关系。同一色调的颜色、色彩的纯度和明度具有共同性，明度按照色相略有变化。不同色调会产生不同的色彩印象，将纯色调全部放在一起，或产生活泼感；而婴儿服饰和玩具都以淡色调为主。在对比色相和中差色相配色中，一般采用同一色调的配色手法，更容易进行色彩调和，如图2-12所示。
图2-12 同一色调配色
类似色调配色即将色调图中相邻或接近的两个或两个以上色调搭配在一起的配色。类似色调配色的特征在于色调与色调之间有微妙的差异，较同一色调有变化，不会产生呆滞感。将深色调和暗色调搭配在一起，能产生一种既深又暗的昏暗之感，鲜艳色调和强烈色调再加明亮色调，便能产生鲜艳活泼的色彩印象。如图2-13所示。
图2-13 类似色调配色
对比色调配色是相隔较远的两个或两个以上的色调搭配在一起的配色。对比色调因色彩的特征差异，能造成鲜明的视觉对比，有一种“相映”或“相拒”的力量使之平衡，因而能产生对比调和感。对比色调配色在配色选择时，会因横向或纵向而有明度和纯度上的差异。例如：浅色调与深色调配色，即为深与浅的明暗对比；而鲜艳色调与灰浊色调搭配，会形成纯度上的差异配色。如图2-14所示。
图2-14 对比色调配色
明度是配色的重要因素，明度的变化可以表现事物的立体感和远近感。如希腊的雕刻艺术就是通过光影的作用产生了许多黑白灰的相互关系，形成了成就感，如图2-15所示；中国的国画也经常使用无彩色的明度搭配。有彩色的物体也会收到光影的影响产生明暗效果，像紫色和黄色就有着明显的明度差。
图2-15 希腊的建筑雕刻艺术
将明度分为高明度、中明度和低明度三类，这样明度就有了高明度配高明度、高明度配中明度、高明度配低明度、中明度配中明度、中明度配低明度、低明度配低明度六种搭配方式。其中高明度配高明度、中明度配中明度、低明度配低明度，属于相同明度配色。一般使用明度相同、色相和纯度变化的配色方式。高明度配中明度、中明度配低明度，属于略微不同的明度配色。高明度配低明度属于对照明度配色。不同明度搭配如图2-16所示。
图2-16 不同明度搭配
红色是一种激奋的色彩，能使人产生冲动、愤怒、热情和活力的感觉。
色彩中加入红色会使其热力强盛，极富动感和喜悦气氛。
红色与黑色的搭配在商业设计中，被誉为商业成功色。红黑搭配色，常用于较前卫时尚等个性要求的页面中。
在红色中加入少量的蓝色，会使其热性减弱，趋于文雅、柔和。
在红色中加入少量的白色，会使其性格变得温柔，趋于含蓄、羞涩、娇嫩。
常见的红色配色方案如图2-17所示。
图2-17 常见的红色配色方案
橙色的波长居于红色和黄色之间，橙色是十分活泼的光辉色彩，是暖的色彩。橙色给人以华贵而温暖、兴奋而热烈的感觉，也是令人振奋颜色，具有健康、富有活力、勇敢自由等象征意义，能给人带来庄严、尊贵、神秘等感觉。
橙色能够用来强化视觉，橙色可以通过变换色调营造出不同氛围的典型颜色，它既能表现出青春的活力，也能够实现稳重的效果。
在橙色中混入少量的蓝色，能够形成强烈的对比，有一种紧张的气氛。使用了高亮度橙色的页面通常都会给人一种晴朗新鲜的感觉。
在橙色中混入少量的红，给人以明亮、温暖的感受。
通过将浅黄色、黄色、黄绿色等邻近色与橙色搭配使用，通过不同明度和纯度的变化得到更为丰富的色阶，通常都能得到非常好的效果。
如图2-18所示，为常见的橙色配色方案。
图2-18 常见的橙色配色方案
黄色具有快乐、希望、智慧和轻快的个性，它的明度最高，因此给人留下明亮、辉煌、灿烂、愉快、高贵、柔和的印象，同时又容易引起味觉的条件反射，给人以甜美、香酥感。
黄色是在页面配色中使用最为广泛的颜色之一，黄色和其他颜色配合很活泼，有温暖感，具有快乐、希望、智慧和轻快的个性。黄色有着金色的光芒，有希望与功名等象征意义，黄色也代表着土地、权力，并且还具有神秘的宗教色彩。
在黄色中加入少量的蓝色，会使其转化为一种鲜嫩的绿色。其高傲的性格也随之消失，趋于一种平和、潮润的感觉。
在黄色中加入少量的红色，则具有明显的橙色感觉，其性格也会从冷漠、高傲转化为一种有分寸感的热情、温暖。
在黄色中加入少量的黑色，其色感和色性变化最大，成为一种具有明显橄榄绿的复色印象。其色性也变得成熟、随和。
在黄色中加入少量的白色，其色感变得柔和，其性格中的冷漠、高傲被淡化，趋于含蓄，易于接近。
如图2-19所示，是常见的黄色配色方案。
图2-19 常见的黄色配色方案
绿色介于冷暖两种色彩的中间，显得和睦、宁静、健康、安全。它和金黄、淡白搭配，可以产生优雅、舒适的气氛。在商业设计中，绿色所传达的是清爽、理想、希望、生长的意象，符合服务业、卫生保健业、教育行业和农业等的要求。
绿色是一种让人感到舒适并且亲和力很强的色彩，绿色在黄色和蓝色之间，偏向自然美，宁静、生机勃勃、宽容，可与多种颜色搭配而达到和谐，也是页面中使用最为广泛的颜色之一。
在绿色中黄的成分较多时，其性格就趋于活泼、友善，具有幼稚性。
在绿色中加入少量的黑色，其性格就趋于庄重、老练、成熟。
在绿色中加入少量的白色，其性格就趋于洁净、清爽、鲜嫩。
常见的绿色配色方案如图2-20所示。
图2-20 常见的绿色配色方案
蓝色是最具凉爽、清新、专业的色彩。它和白色混合，能体现柔顺、淡雅、浪漫的气氛。蓝色给人以沉稳的感觉，且具有深远、永恒、沉静、博大、理智、诚实、寒冷的意象，同时蓝色还能够表现出和平、淡雅、洁净、可靠等。在商业设计中强调科技、商务的形象，大多选用蓝色当标准色。
蓝色朴实、不张扬，可以衬托那些活跃、具有较强扩张力的色彩，为它们提供一个深远、广博、平静的空间。蓝色还是一种在淡化后仍然能保持较强个性的颜色。
蓝色是冷色系的典型代表，而黄色、红色是暖色系里最典型的代表，冷暖色系对比度大，较为明快，很容易感染和带动浏览者的情绪，有很强的视觉冲击力。蓝色是容易获得信任的色彩，蓝色调的网页在互联网上十分常见。
如果在蓝色中分别加入少量的红、黄、黑、橙、白等色，均不会对蓝色的性格产生较明显的影响。
如果在蓝色中加入较多黄色，其性格趋于甜美、亮丽、芳香。
在蓝色中混入适量的白色，可使蓝色的知觉趋于焦躁、无力。
如图2-21所示是常见的蓝色配色方案。
图2-21 常见的蓝色配色方案
紫色是波长最短的可见光波。紫色是非知觉的颜色，它美丽而又神秘，给人深刻的印象，它既富有威胁性，又富有鼓舞性。紫色是象征虔诚的色相。
紫色与紫红色都是非常女性化的颜色，它给人的感觉通常都是浪漫、柔和、华丽、高贵、优雅，特别是紫红色更是女性化的代表颜色。不同色调的紫色可以营造非常浓郁的女性化气息，而且在灰色的衬托下，紫色可以显示出更大的魅力。高彩度的紫红色可以表现出超凡的华丽，而低彩度的粉红色可以表现出高雅的气质。
在紫色中红的成分较多时，其知觉具有压抑感、威胁感。
在紫色中加入少量的黑色，其感觉就趋于沉闷、伤感、恐怖。
在紫色中加入白色，可使紫色沉闷的性格消失，变得优雅、娇气，并充满女性的魅力。
如图2-22所示是常见的紫色配色方案。
图2-22 常见的紫色配色方案
无彩色是指彩色以外的其他颜色，常见的有金、银、黑、白、灰。明度从0变化到100，而彩度很小接近于0。
无彩色配色法是指以黑色、白色、灰色这样的无彩色进行搭配。无彩色为素色，没有彩度，但是若将这些素色进行不同的组合搭配，可以产生韵味不同、风格各异的效果。无彩色在颜色搭配上比较自由随便，难度不大，总能给人以自然、统一、和谐的气氛。
常见的无色系配色方案如图2-23所示。
图2-23 常见的无色系配色方案