在实用美术中，常有"远看色彩近看花，先看颜色后看花，七分颜色三分花"的说法。
这也就说明，在任何设计中，色彩对视觉的刺激起到第一信息传达的作用。因此，对色彩的基础知识的良好掌控，在网页设计中才能做到游刃有余。
为了使下面的网页配色分析更易于理解，我们先来了解
色彩的RGB模式和HSB模式。
■ RGB
RGB是表示红色绿色蓝色又称为三原色光，英文为R(Red)、G(Green)、B(Blue)，在电脑中，RGB的所谓"多少"就是指亮度，并使用整数来表示。
通常情况下，RGB各有256级亮度，用数字表示为从0、1、2至255。虽然数字最高是255，但0也是数值之一，因此共256级。按照计算，256级的RGB色彩总共能组合出约1678万种色彩，即256×256×256＝16777216。通常也被简称为1600万色或千万色。也称为24位色(2的24次方)。
对于单独的R或G或B而言，当数值为0时，代表这种颜色不发光；如果为255，则该颜色为最高亮度。因此当RGB三种色光都发到最强的亮度，纯白的RGB值就为255,255,255。屏幕上黑的RGB值是0,0,0。R，意味着只有红色存在，且亮度最强，G和B都不发光。因此最红色的数值是255,0,0。同理，最绿色就是0,255,0；而最蓝色就是0,0,255。黄色较特殊，是由红色加绿色而得就是255，255，0。（详细分析请参考赵鹏所写的《
电脑美术设计中的色彩模式详解》）
 |  |
| 纯白色数值为R255,G255,B255 | 纯黑色数值为R0,G0,B0 |
 |  |
| 红色数值为R255,G0,B0 | 绿色数值为R0,G255,B0 |
 |  |
| 蓝色数值为R0,G0,B255 | 黄色数值为R255,G255,B0 |
RGB模式是显示器的物理色彩模式。这就意味着无论在软件中使用何种色彩模式，只要是在显示器上显示的，图像最终就是以RGB方式出现。
■ HSB
是颜色分为色相、饱和度、明度三个因素。英文为H(Hue)、S（Saturation）B（Brightness)饱和度高色彩较艳丽。饱和度低色彩就接近灰色。亮度高色彩明亮，亮度低色彩暗淡，亮度最高得到纯白，最低得到纯黑。一般浅色的饱和度较低，亮度较高，而深色的饱和度高而亮度低。
下一节我们讲讲色彩三属性以及一些网页配色实例。
许多初学者对色彩的属性和原色概念模糊，容易混淆，下面我们就先从几个概念入手。今天介绍色彩的三个属性。
颜色可以分为非彩色和彩色两大类。非彩色指黑色、白色和各种深浅不一的灰色，而其他所有颜色均属于彩色。从心理学和视觉的角度出发，彩色具有三个属性：色相、明度、纯度（彩度）。
 基本色相环 | ■ 色相（Hue）：
也叫色调，指颜色的种类和名称，是指颜色的基本特征，是一种颜色区别于其他颜色的因素。色相和色彩的强弱及明暗没有关系，只是纯粹表示色彩相貌的差异。如红、黄、绿、蓝、紫等为不同的基本色相。
|
■ 明度（Value）：
也叫亮度，指颜色的深浅、明暗程度，没有色相和饱和度的区别。不同的颜色，反射的光量强弱不一，因而会产生不同程度的明暗。非色彩的黒、灰、白较能形象的表达这一特质。
明度的递增
| → 明度网页例图：http://www. |
 |
明度分析： 从上图网页所选取的4个主要色块的RGB数值来看，这4块色彩组合显示的RGB数值很高，接近于最高值255。RGB相互间的数值相近，由于有RG的高数值与B高数值混合，整个网页给人的感觉非常协调，柔和雅致，心情愉悦。
结论： RGB同时呈现相近的高数值时，相近等量的色彩相互混合，页面呈高明度灰色段，协调的柔和状态，令人遐想，对视觉刺激是缓慢的，适合长时间观看。但由于数值接近，因此色阶平稳，同时存在着不够醒目的状态。
■ 纯度(Chroma）：
也叫饱和度，指色彩的鲜艳程度。原色最纯，颜色的混合越多则纯度逐渐减低。如某一鲜亮的颜色，加入了白色或者黑色，使得它的纯度低，颜色趋于柔和、沉稳。
加入黑色的纯度变化和加入白色的纯度变化 | → 纯度网页例图：http://www. |
 |
纯度分析：
上图网页中选取了主要的两种色系为组合。运用HBS数值模式更易于理解分析该网页的纯度情况。
我们看到蓝色S数值呈现99％具有相当高的饱和度，B明度为79%，玫瑰色S饱和度数值为85%，B明度为97％。当饱和度和明度同时呈最高值时，色彩对视觉的刺激强度到达最高状态。由于蓝色的明度稍低，饱和度较高，而玫瑰色的明度较高，该颜色纯度随之加强，因此玫瑰色相对蓝色对人的视觉刺激更强烈。
结论：
HSB模式中S和B呈现的数值越高，饱和度明度越高，页面色彩强烈艳丽，对视觉刺激是迅速的，醒目的效果，但不易于长时间的观看。以上两种颜色的S数值接近，是强烈的状态。H显示的度是代表在色轮表里某个角度所呈现的色相状态，相对于SB来说，意义不大。
下一节我们讲：常用配色的基本概念与实例分析。
在实用美术中，常有"远看色彩近看花，先看颜色后看花，七分颜色三分花"的说法。
这也就说明，在任何设计中，色彩对视觉的刺激起到第一信息传达的作用。因此，对色彩的基础知识的良好掌控，在网页设计中才能做到游刃有余。
前面我们介绍了常用的电脑色彩模式RGB、HSB，以及色彩的三大属性，今天我们介绍常用配色的基本概念和相关实例剖析。
色环 |
色环是色彩按红、黄、绿、蓝、红依次过度渐变呈现出来的不同颜色，就可以得到一个色彩环。色环通常包括12种不同的颜色。
|
三原色 |
■ 原色：
也叫"三原色"。即红、黄、蓝三种基本颜色。自然界中的色彩种类繁多，变化丰富，但这三种颜色却是最基本的原色，原色是其他颜色调配不出来的。除白色外，把三原色相互混合，可以调和出其他种颜色。
根据三原色的特性做出相应的色彩搭配，有最迅速最有力最强烈的传达视觉信息效果。
|
| → 黄色网页例图：http://www./studienart/i_flash.htm |
|
黄色分析：
选取了主色调黄色为示例。我们看到RGB数值中RG呈现最高值255时，HSB数值中的SB也呈现最高值100%，页面呈现最高纯度亮度——纯黄色。因此黄色在三原色中也是亮度最高的颜色。
结论：
HSB中SB呈现的数值越高，饱和度明度越高，页面色彩强烈艳丽，由于黄色是亮度最高的颜色这一特性，也给人视觉产生强烈刺激的状态，对视觉刺激是迅速的、警戒、醒目的效果，但不易于长时间观看。
| → 红色网页例图：http://www. |
|
红色分析：
我们看到RGB中R的数值是227，混合了G30、B40，因此红色的纯度轻微降低，颜色稍偏深红。HSB数值中S显示的饱和度为87%，B为89%，因此颜色还是较为饱和明亮。
结论：
主色R227数值较高的时候，由于混合了G30、B40少许颜色，饱和度明度稍微降低，视觉刺激减弱，红色特性显得较沉稳。但由于红色是最温暖最有视觉冲击力的颜色特性，该网页整体看来仍然厚重而热烈的表达了主题。
| → 蓝色网页例图：http://www. |
|
蓝色分析：
RGB数值中B蓝色的数值是131与 R2、G83相混合，蓝色的纯度降低。结合HSB中数值H色相目前显示的是203°，而三原色的纯蓝为240°来看，蓝色的色相偏离较大，加上B为51%的明度，颜色偏暗，因此视觉冲击力较弱。页面沉稳、凝重。
结论：
当蓝色色相偏离于三原色的纯蓝时，视觉冲击力削弱。页面呈沉稳、平静的感受。蓝色在三原色里是视觉传递速度最慢的颜色特性，适合用于表达成熟、稳重、安静的网页设计主题。蓝色在网页设计里也是使用得较频繁的颜色。
间色 |
■ 间色：
又叫"二次色"。它是由三原色调配出来的颜色，是由2种原色调配出来的。红与黄调配出橙色；黄与蓝调配出绿色；红与蓝调配出紫色，橙、绿、紫三种颜色又叫"三间色"。在调配时，由于原色在份量多少上有所不同，所以能产生丰富的间色变化。
|
| → 间色网页例图：http://cidadefm. |
|
间色分析：
上网页例图4种间色搭配一起非常明快、鲜亮。
从RGB数值显示上看，绿色含量较高达到208，混合了R189的黄色光，因此颜色偏黄绿色，由于添加了B18，饱和度相对降低。玫瑰色中R的含量最高，与B109混合为主要组成色，添加了少量的G27黄，纯度偏高。橙色中R的含量很高为255，混合了G145黄为主要组成色，添加了第三色B34，饱和度稍降低。紫色是由蓝色和红色调配而成，B为170，R为148，混色份量相当也就成为了组合紫色这一间色的主要成份，但是由于添加了G87，也是4组颜色中的间色混合第三色数值最高的，HSB中S数值相对其他三色，降低很多，因此颜色相对于其它3种较沉稳，缓和。
以上4组颜色RGB数值的共同点是以两色混合为主，都是三位数值，另外一色份量较少，为两为数值，因此饱和度较高，色相倾向明显。HSB数值的共同点是，除了紫色，其他三色的S饱和度相当，属较高数值，因此视觉刺激也强。
结论：
间色是由三原色中的两原色调配而成的，因此在视觉刺激的强度相对三原色来说缓和不少。属于较易搭配之色。
间色尽管是二次色，但仍有很强的视觉冲击力，容易带来轻松、明快、愉悦的气氛。
复色 |
■ 复色：
也叫"复合色"。复色是由原色与间色相调或由间色与间色相调而成的"三次色"，复色是的纯度最低，含灰色成份。复色包括了除原色和间色以外的所有颜色。
|
| → 复色网页例图：http://www. |
|
复色分析：
以上4种颜色中深绿色和赭石色为复色，之所以还选择其它2颜色，为的是更好的配合说明复色的特性，如果没有另外两种非复色搭配，页面配色就可能出现肮等不舒服的感觉。
我们看到深绿及赭石这两种复色的数值都以一个份量最多的三位数，另外两者成份相当，都为两位数组合而得。RGB之间的数值差距较接近、不明显，色阶较趋于直线平稳，呈灰阶。HSB中SB显示的数值也非常接近，成为符合复色特性的必须条件。
结论：
复色是由两种间色或原色与间色混合而成，因此色相倾向较微妙、不明显，视觉刺激度缓和，如果搭配不当，页面便呈现易脏或易灰朦朦的效果，沉闷、压抑之感，属于不好搭配之色。但有时复色加深色搭配能很好的表达神秘感、纵深感空间感；明度高的多复色（参看明度的网页例图）多用来表示宁静柔和、细腻的情感，易于长时间的浏览。
补色 |
■ 补色：
是广义上的对比色。在色环上划直径，正好相对（即距离最远）的两种色彩互为补色。如：红色是绿色的补色；橙色是蓝色的补色；黄色是紫色的补色。
补色的运用可以造成最强烈的对比。
|
| → 补色网页例图：http://www. |
|
补色分析：
选用了一组红绿对比色，极赋视觉冲击力、所表现出的性格异常鲜明。
我们看到RGB中绿色的数值显示情况符合复色的条件，因此注定了该颜色明度稍暗、纯度较低的特性，而红色R数值118构成了该色的主要成份，其他G72，B61数值接近，纯度和亮度相对绿色较高，因此2色在构成色彩空间差距上拉大。HSB中2色的S数值也显示出，它们的饱和度相差较大。
结论：
补色最能传达强烈、个性的情感。纯度稍低的绿色为背景的大面积使用，对比并突出了前景纯度明度较高的面积较小红色的图形，形成了视觉中心重点突出，达到主次分明的主题效果。
红绿、橙蓝、黄紫这三组补色中，前两种使用得最频繁。这三组补色搭配出的最终效果和目的，可以用两个字来概括——强烈！
