[转] 前端学习必备基础（1）

我们生活在五彩缤纷的世界里，天空、草地、海洋、漫无边际的薰衣草都有它们各自的色彩。你、我、他也有自己的色彩，代表个人特色的衣着、家装、装饰物的色彩，可以充分反映人的性格、爱好、品位。

设计爱好者对色彩的喜爱更是“如痴如狂”，他们知道色彩不仅仅是点缀生活的重要角色，它也是一门学问。要在设计作品中灵活、巧妙的运用色彩，使作品达到各种精彩效果，就必须对色彩好好研究一番。今天我们首先学习一些关于色彩的最简单、基础也是很重要知识，感受一下色彩运用的妙处!

 

认识什么是色彩

 

一、色彩的构成

色彩一般分为无彩色和有彩色两大类。无彩色是指白、灰、黑等不带颜色的色彩，即反射白光的色彩，如图1。

图1

有彩色是指红、黄、蓝、绿等带有颜色的色彩，如图2中的色彩。

图2

 

二、色彩的对比

在一定条件下，人对同一色彩有不向的感受。色彩单一给人一种印象。在不同的环境下，多色彩给人另一种印象。色彩之间这种相互作用的关系称“色彩对比”。

色彩对比包括两方面。其一，时间隔序，称“同时发生的对比”;其二，空间位置，称“连贯性的对比”。对比本来是指性质对立的双方相互作用、相互排斥。然 而，在某种条件下，对立的双方也会相互融合、相互协调。并置的不同色调往往相抵消对方的色彩，这种相互抵消的现象称“同化现象。对比的具体运用和效果，将 在以后的文章中再详细讲解。

 

三、色彩的表现手法

人的色感可用色彩三属性——色调、亮度、饱和 度表示。不过三属性毫无差异的同一色彩会因所处位置、肯景物不同而给人截然相反的印象。我们以蓝色编织物和蓝色木地板为例，图3，假定它们的三属性相同， 但在观赏者的眼中，编织物的色彩与木地板的色彩毫无共同之处。这种现象称为“色彩的表现形式”。

图3

色彩的表观形式包括面色、表面色、空间色等。面色又称“管窥色”，像天空色彩平平展展，缺乏质感，给人柔软的感觉(图4)。

图4

表面色指色纸等物体的表面色彩。表面色依距离远近给人不同的质感。图5中是同一张纸，取了远近距离不同的位置。两张图看起来有点明暗程度不同的感觉，远距离的看起来颜色要深一些。

图5

空间色又称“体色”，似充满透明玻璃瓶中的带色液体，是指弥漫空间的色彩。此外，还有表而光泽、光源色等。

 

四、色彩的特性

1、色彩的冷暖

物体通过表面色彩可以给人们或温暖或寒冷或凉爽的感觉。一般说来，温度感觉是通过感觉器官触娱物体而来.与色彩风马牛不相及。事实上，各类物体借助五彩缤纷的色彩给人一定的温度感觉。

红、橙、黄等颜色使人想到阳光、烈火，故称“暖色”。如图6中燃烧的深林，如果你没看到图，听到火，肯定会想到是红色，灼热的感觉。

图6

绿、青、蓝等颜色与黑夜、寒冷相联，称“冷色”。图7，夜晚被灯光照亮的宾馆大厦，感觉冷冷的。

图7

红色给人积极、跃劝、温暖的感觉。蓝色给人低静、消极的感觉。绿与紫是中性色彩刺激小，效果介于红与蓝之间。中性色彩使人产生休憩、轻松的情绪，可以避免产生疲劳感。

人对色彩的冷暖感觉基本取决于色调。色系一般分为暖色系、冷色系、中性色系三类。色彩的冷暖效果还需要考虑其他因素。例如，暖色系色彩的饱和度愈高，其 温暖的特性愈明显;而冷色系色彩的亮度愈高，其特性愈明显。我们把上面的图6、7，分别增加饱和度和亮度，看到各自反映的效果更加突出(图8)。

图8

2、色彩的轻重感觉

各种色彩给人的轻重感不同，我们从色彩得到的重量感，是质感与色感的复合感觉。例如两个体积、重量相等的皮箱(图9)分别涂以不同的颜色，然后用手提、 目测两种方法判断木箱的重量。结果发现，仅凭目测难以对重量做出准确的判断，可是利用目测木箱的颜色却能够得到：轻重感，浅色密度小，有一种向外扩散的运 动现象，给人质量轻的感觉深色密度大，给人一种内聚感，从而产生份量重的感觉。

图9

3.、色彩的膨胀与收缩

比较两个颜色一黑一白而体积相等的正方形(图10)可以发现有趣的现象，即大小相等的正方形，由于各自的表面色彩相异，能够斌予人不同的面积感觉。白色 正方形似乎较黑色正方形的面积大。这种因心理因素导致的物体表面面积大于实际面积的现象称“色彩的膨胀性”。反之称“色彩的收缩性”。给人一种膨胀或收缩 感觉的色彩分别称‘膨胀色”、“收缩色”。色彩的胀缩与色调密切相关，暖色同膨胀色，冷色属收缩色。

图10

4、色彩的前进性与后退性

如果等距离地看两种颜色，可给人不同的远近感。如：黄色与蓝色以黑色为肯景时(图11)，人们往往感觉黄色距离自己比蓝色近。换言之，黄色有前进性，蓝色有后退性。较底色突出的前进性的色彩称“进色”;较底色暗淡的后退色彩称“退色”。

图11

一般而言，暖色比冷色更富有前进的特性。两色之间，亮度偏高的色彩呈前进性，饱和度偏向的色彩也呈前进性。但是色彩的前进与后退不能一概而论，色彩的前进、后退与背景色密切相关。如在白背景前(图12)，属暖色的黄色给人后退感，属冷色的蓝色却给人向前扩展的感觉。

图12

5、色彩艳丽与素雅

—般认为，如果是单色，饱和度高，则色彩艳丽。饱和度低，给人素雅的感觉。除了饱和度，亮度也有一定的关系。不论什么颜色，亮度高时即使饱和度低也给人 艳丽的感觉。综上所述，色彩是否艳丽、素雅，取决于色彩的饱和度线段，亮度尤为关键。高饱和度、高亮度的色彩显得艳丽。我们从图13中的一组变化饱和度、 亮度的图片，直接的感受艳丽与素雅的概念。

图13

混合色的艳丽与素雅取决于混合色中每一单色本身具有愈特性及混合色各方的对比效果。所以对比是决定色彩艳丽与居雅的重要条件。此外，结合色彩心理因素，艳丽的色彩一般和动态、快活的感情关系密切：素雅与静态的抑郁感情紧密相联。

除了上面讲述的色彩的几种特性之外，色彩的特性还包括联想、象征意义。对色彩的联想事物，根据观看人的年龄不同，想到的结果也不一样，例如中学生看到白 色，容易联想到墙、白雪、石膏像、白兔等。成年人可能会想到护士、正义、白房子等等。白色象征纯洁、神圣的事物，例如新娘的婚纱都是用的白色，代表婚姻的 神圣和严肃。

 

五、色彩和性格

人们对某种色彩的偏爱与性格有很大关系，不同的色系具有不同的含义。因此我们可以根据他人的衣着色彩、房间色彩等身边的东西，分析他的性格。我们可以大概的分析一下各色系代表的性格：

红色：冲动，精力旺盛，具有坚定的自强精神。

橙黄色：对生活富于进取，开朗，和蔼。

黄色：胸怀远大理想，有为他人献身的高尚人格。

绿色：不以偏见取人，胸怀宽阔，思想解放。

蓝色：性格内问，责任感强，但偏于保守。

 

色系和色调概念介绍

一、色调和色系的概念

PCCS(Practical Color-ordinate System)色彩体系是日本色彩研究所研制的，色调系列是以其为基础的色彩组织系统。其最大的特点是将色彩的三属性关系，综合成色相与色调两种观念来构成色调系列的。从色调的观念出发，平面展示了每一个色相的明度关系和纯度关系，从每—个色相在色调系列中的位置，明确的分析出色相的明度、纯度的成分含量。

 

二、色调系列的组织结构

色调系列是由24个色相与9个色调组成的，如图1，看到色调系列的24色色环。

图1，24色色环

从图1中的24色环，我们可以总结一下24色系的组织结构：

Pccs色彩体系的色环的结构，是依据“三原色学说”为理论基础的。以红(R)、黄(Y)、蓝(B)为三主色， 由红色和黄色产生间色——橙(O);黄色与蓝色产生间色——绿(G);蓝包与红色产生间色——紫(P)，组成六色相。在这六个色相中，每两个色相分别再调出三个色相(如图1).便组成24色色相环。

9个色调是以24色相为主体、分别以清色系、暗色系、纯色系、浊色系色彩命名的。色调与色调之间的关系同色彩体系的三要素关系的构架是一致的，明暗中轴线由不同明度的色阶组成。

靠近明暗中轴线的色组、是低纯度的浊色系色调，Ltg色组、g色组。

远离中轴线的色组、是高纯度的v色、b色组;靠近明暗中轴线上方的色组，是高明度的清色系P色组、Lt色组。

中轴线下方的色组，是低明度的暗色系，dp色组、dk色组。

中央地带的色组，是明度、纯度居中的d色组。

 

由此，形成9组不同明度、不同纯度的色调如下：

1.v色组，纯度最高.称纯色调。

2.b色组，明度、纯度略次，称中明调。

3,Lt色组，明度偏高，称明色调。

4.dp色组，明度偏低，称中暗调。

5.dk色组，明度低，称暗色调。

6.p色组，明度高、纯度略低，称明灰调。

7.Ltg色组，明度中、纯度偏低，称中灰调。

8.d色组.明度中、纯度中，称浊色调。

9.g色组，明度低、纯度低.称暗灰调。

(各个色调的具体效果，请参看下文的详细叙述。)

 

三、色调的分类

配色的一般规律为：任何一个色相均可以成为主色(主色调)，与其它色相组成互补色关系、对比色关系、邻近色系和同类色关系的色彩组织。

 

四、各色调之间的关系

首先我们通过图示直观的理解色点间关系的分类，如图2。然后再详细地分析不同关系的色调组合在一起的色彩视觉，心里效果。

图2

(1)互补的关系

在24色色相色环中彼此相隔十二个数位或者相距180度的两个色相，均是互补色关系。互补色结合的色组，是对比最强的色组。使人的视觉产生刺激性、不安定性。如果配合不当，容易产生生硬、浮夸、急躁的效果。因此要通过处理主色相与次色相的面积大小，或分散形态的方法来调节、缓和过于激烈的效果。

图3是一组橙蓝互补色对比的色组，橙色面积大而且加入辅助色红色，起了主导色调的作用，效果既艳丽、辉煌又安然，恰列好处。

图3

(2)对比色关系

色项环中相距135度或者彼此相阳八几个数位的两色，为对比色关系，属中强对比效果的色组。色相感鲜明，各色相互排斥，既活泼又旺盛。配色时，可以通过处理主色与次色的关系而达到色组的调和，也可以通过色相间秩序排列的方式，求得统一和谐的色彩效果。图4属中明调，正是这种秩序排列形式的应用。

图4

(3)邻近色关系

色相环中相距90度，或者相隔五六个数位的两色，为邻近色关系，属中对比效果的色组。色相间色彩倾向近似，冷色组或暖色组较明显，色调统一和谐、感情特性一致。图5为蓝紫红调色组，是明色调邻近色对比关系。

 

色彩的实际应用

一、色彩知识的补充

(一)色彩和面积的关系

色彩构成中，色彩面积的大小，直接关系到色彩意向的传达。例如红色，当它的用色面积只占画面的20%时，在作品中起到了点缀作用(如图1)。

图1

 

如果用色面积占到90%时，那给人的感觉大不相同。如图2

图2

在上一期的文章中，我们谈到主色调，在这里用色面积大的颜色就是所说的主色调。在一个作品中所用的色调不变，只改变各种色调作占的比例，将会得 到意想不到的色彩效果。从以上的理论中我们可以总结出色彩的使用技法——变换色调。这种方法很简单，大家可以自己试试，变换作品中面积不同的色调，得到另 一种风格的作品。如图4

图4

 

除了变换色调的方法，还可以总结出另一种方法——改变主色调的位置。在一个作品中，不一定只有一个用色面积大的色 调，比如红色占了40%、黄色占了30%，或者还有其它色调也占用了大面积。这种情况，主色调实际上就不是一种颜色了。如图5，两幅图的结构是一样的，有 多个主色调，我们随意改变色调的位置，两幅图效果大不相同。

图5

 

如果一个作品中的两个颜色、或多个颜色的用色面积是一样的，这种情况我们称为等面积色调。如图6

图6

 

(二)色彩的色线

色线的概念怎么理解呢?可以简单的说，由于色面的衔接，可以引起视觉上产生的色线幻觉。如图7

图7

 

上图中，只有红、黑两个色面，但在它们衔接的部分感觉就是一个线条，将它们划分为左右两块。视觉上中间有一条线，实际上我们在作图时并没有特意画一条线。有些画面有一个主色调，但给它赋予了背景色，背景色可以称为补色。当补色相互衔接的时候也暗示了色线。如图8

图8

 

如果使用的颜色过多，可以产生更多视觉上的色线效果。通过对色线概念的解释，需要注意的是它和我们平时在平面设计中 使用的轮廓线要加以区别。色线只是视觉上的效果，实际上不存在。轮廓线是我们画的，实际上是存在的。如图可以看到两种线条的效果。这两种线条，有时候视觉 上的区分很微秒不易引起注意，如图9，可以看到两种线条。

图9

 

二、色彩的实际运用

我们在平面设计中，往往通过色彩来实现某种效果。除了前面几期我们介绍的各种色调之外，实际上现实中的某些事物具体在色彩体系中是没有固定色调 可循的。有的事物甚至自身根本不带颜色，是借助其他事物为媒介使我们感觉它有颜色，它存在的。例如皮肤的颜色，受到各种因素的影响没有固定的色彩。水，自 身根本没有颜色。面对这些情况，我们只有依照设计、绘画用色的一些常规方法、用色时需要考虑的基本条件来作处理。

(一)寻找皮肤色

在平面设计中、绘画中最难处理的是皮肤色。如果从真实皮肤的色彩看，颜色中能符合这种微妙程度的色调极少。皮肤下的静脉、动脉及其肌肉、脂肪给 肤色造成了不均匀的外观表现。每个人的都有自己独有的皮肤颜色，再加上皮肤还会受到光线或温度的影响。绘画中被经常用来表现大部分肤色的肉色是—种合成 色，是在银白和朱红里添加进了黄。如图10中的卡通人物，其肤色使用了我们绘画中所谓的肉色，和真实的人物皮肤完全不同。

图10

 

(二)寻找水色

水本身是无色透明的，但是由于与周围的事物的关系，因此才具有可见的色彩。在风景中，天空、树林、沙丘、云、房子，以及其它各种事物对水的影响 都应通过色彩给予反映。例如，海水的深蓝色，月光下闪着微波荡漾的银色湖水等。为了把这些对象物的色彩在调色板上大体地再现出来，设计师首先从认真观察整 体开始。先决定色调，然后抓住在局部忽隐忽现的色彩。可以结合树木或天空的色彩。

在寻找水的颜色的时候，不要忘记空气和水与其它事物有不同的姿态。换句话说，气体、液体同固体是不相同的。要以最接近处所看到的色彩的纯色为基 础，从对象出发，在有关系的要素中寻找最有代表性的影响事物。如图11，同样是瀑布的水，但受到环境的色彩影响，水的颜色产生不同的效果。

图11

(三)寻找白色

对于和水类似的雪，似乎也是没有自身色彩的东西。白色的东西飘落下来，堆积起来必然是白色的。那么面粉或者石灰落下堆积起来能看成是雪吗? 有所谓“棉花似的白雪”的说法，这就是说雪也有“表情”。更何况自然的降雪现象是多种多样的。因此，雪在与气候、日照、时间以及风土人情的关系上，应当有 很大的差别。在风景的整体之中，雪的确是白色，特别在和天空进行比较。但这种白色是被左右着的，在阴影里这种特征更加明显，如图12。如果在舞台上，雪被 打了淡淡的蓝紫色的光，这样才可以引起观众的情感共鸣。

图12

 

本篇对色彩的知识作了一些补充。色调用色面积的大小对作品体现的效果起决定因素，认识色线的概念，是为了与我们画图 像的轮廓线的概念加以区别，希望大家能够准确的区分，不要混淆。在绘画过程中好好的把握和运用它们。在实际运用讲解中，主要是针对现实中几种不好把握表现 色彩的事物，介绍通常的处理方法和考虑因素。

图5

(4)同类色关系

色相环中相距45度，或者彼此相隔二三个数位的两色.为同类色关系，属弱对比效果的色组;同类色色相主调十分明确，是极为协调、单纯的色调。图6为蓝绿调色组，组成恬静柔美的效果。

图6

 

五、色调的象征意义及欣赏

1.鲜明的纯色调(v)

纯色调是由高纯色相组成的色调，每一个色相个性鲜明，具有挑战性、令人振奋、赏心悦目。强烈的色相对比意味着年轻、充满活力与朝气。下面我们欣赏几幅纯色调的图片。如图7.

图7

2.清新的中明调(b)

中色调的刺激感仅次于高纯色调，中色调加入了白色，提高了明度。因此县的清新、明朗，像少男少女的纯真、朝气蓬勃，具有上进精神。我们欣赏几幅中色调的图片。如图8

图8

3.明净的明色调(lt)

明色调属于青色系列，其特征是加入了多量的白色，提高整体色调的明度，色感相对减弱。明色调犹如春天的新绿，透明清丽、明净、轻快。以明色调的暖系列为主的配色，有甜美、风雅之味道，像少女般的清纯。明色调的冷系列显得清凉、爽快。如图9

图9

4.高雅的明灰调(p)

这是在全色相色系大量的调入浅灰颜色，是色相全部带有灰浊味。由于过多调入灰白色，色相的明度提高了，形成高明度的灰调子，这是明灰调的特征。明灰调以平静的感觉，蕴含着高雅与恬静，显示出另一种美的境界。如图10

图10

5.朴实的中灰调(ltg)

中灰调是一组中等明度的含灰色调，色相环中所有颜色均调入中灰色，是纯度降低，色相感淡薄。中灰调带有几分深沉与暗淡，有着朴实、含蓄、稳重的特色。如图11

图11

6. 浑厚的暗灰调(g)

色相环中所有颜色均调入暗灰色，使色相感呈低弱灰暗的灰调。就像乌云密布、阴郁暗淡，令人压抑。如图12

图12

7.中庸的浊色调(d)

浊色调居于色彩体系的明暗中轴线与高纯色之间的位置，具有明显的色彩个性，有宜于调和色调。如图13

图13

8.稳重的中暗调(dp)

中暗调署与暗色系色彩，调入了少量黑色。此色调在保持色相原有的基础上有笼罩了一层较深的调子，显得稳重老成、严谨与尊贵。如图14

图14

9.深沉的暗色调(dk)

暗色调入了大量的黑色，形成浓浓的深色调。隐约略显各色的相貌，这是暗色调的特征。表现出深沉、坚实、冷静、庄重的气质。如图15

图15