一、216网页安全色

Tone\ 色相Hue 1 2 3 4 5 -1 -2 -3 -4 -5      
色调 对比度→ 黄绿 绿 青绿 蓝紫 紫) 紫红 无色彩    
亮度↑   R YR Y GY G BG B PB P RP Neutral    
鲜明 V                         华丽而强烈,对比度高
ff0033 ff9900 ffff00 99ff33 00ffcc 00ffff 0099ff 3366ff cc33ff ff33cc      
                    N9.5 ffffff  
ff3333 ff3300 ffff33 99ff00 00ff33 33ffff 0033ff 3300ff cc00ff ff00cc    
高亮 S                     N9   华丽而强烈,对比度高
cc3333 ff6600 cccc00 99cc00 33cc99 33cccc 3333ff 9900cc cc3399    
            0099cc            
cc0000 ff0000 66cc00 66ff00 33ff66 00cc66 0000ff cc00cc ff00ff    
明亮 B                     N8    
ff6666 ff9933 ffff66 ccff00 33ffcc 66ffff 0066ff cc66ff ff66cc cccccc  
            3399ff            
ff3366 ff6633 66ff33 66ff33 66ff66 00ff99 0000ff cc33ff ff33ff    
清澈 P                     N7   柔和的感觉,亮度和对比度都较高
ff9999 ff9966 ffff99 ccff66 66ffcc 99ffff 33ccff 6666ff cc99ff ff99cc    
                         
ff0066 ffcc00 ccff33 66ff66 33ff66 33ff99 00ccff 6633ff cc66cc ff66ff    
苍白 VP                     N6    
ffcccc ffcc99 ccff99 ccffcc ccffff 9999ff ffccff 999999  
    ffffcc       99ccff   ccccff        
ff6699 ffcc33 99ff66 99ff99 66ff99 9933ff ff99ff    
灰亮 Lgr                     N5   朴素而冷静
cc9999 cc9966 cccc99 99cc99 99ffcc 99cccc 66ccff 6699ff 9999cc cc99cc    
                         
cc3366 ff9966 66cc66 33cc33 33ff33 00ff66 00cccc 6600ff 9966ff ff3399    
隐约 L                     N4   柔和的感觉,亮度和对比度都较高
cc6666 cc9933 cccc66 99cc66 66cc99 66cccc 0066cc 9966cc cc6699 666666  
            3399cc            
cc0066 cc9900 cccc33 99cc33 33cc00 00cc99 3300cc 9900ff cc3366    
浅灰 Gr                     N3   朴素而冷静
996666 669966 339966 669999 6666cc 666699 996699    
  996600 999966       6699cc            
cc3300 33cc00 00cc00 009900 6633cc 663399 cc0099    
阴暗 Dl                     N2   朴素而冷静
990033 cc6600 999933 669933 009966 339999 336699 3366cc 9933cc 993399 333333  
                         
cc0033 cc6633 999900 33cc33 009933 009933 333399 3333cc 6600cc 990099    
深暗 Dp                     N1   深沉凝重,亮度很低
993333 996633 666600 006633 009999 006699 0033cc 660099 990066 000000  
      669900                  
990000 993300 666633 336633 006666 333366 000099 000066 993366      
黑暗 Dk                         深沉凝重,亮度很低
660033 663300 333300 336600 003300 336666 003366 003399 330066 663366      
                         
663333 660000 330000 006600 003333 006666 000033 330099 330033 660066      

二、Color Image Space

(一)不同颜色之间的印象差异

1.红色:动态的感觉。

2.蓝色:静态的生硬的感觉。

3.黄色:柔和的动态的感觉。

4.绿色:柔和的感觉,既不动态也不静态。

(二)配色印象空间

设计站点时,通常都需要搭配四五种甚至更多种颜色,为了对多种颜色的混合使用进行评价,需引入新的分析方法----配色印象空间。

1.静态柔和感觉:通常都是隐约柔和颜色之间的搭配。

2.动态柔和感觉:通常都是鲜亮颜色间的搭配。

3.动态生硬感觉:通常都是鲜亮颜色和浑浊暗淡色之间的搭配。

4.静态生硬感觉:通常都是灰冷颜色之间的搭配。

在“配色印象空间”中,相距较远的颜色之间的印象会有较大的差异,而距离较近的颜色之间的印象会比较相近,也就是说颜色间的距离与印象的差异程度成正比例关系。

(三)配色基本知识

1.基于色相的配色关系:

采用不同色调的同一色相时,称之为同一色相配色。

采用两侧相邻的色相配色时,称为类似色相配色。

采用互为补色的或使用色相环中距离较远的颜色配色,称为相反色相配色。

同一色相类似色相配色总体上会给人一种安静整齐的感觉。

相反色相配色则更具变化感

2.基于色调的配色关系:

选择同一色调不同色相的配色方案,称为同一色调配色。

选择类似基准色调的本色方案,称为类似色调配色。这些色调在色调表中比较靠近基准色调。

选择与基准色调相反的色调的配色方案,称之为相反色调配色。这些色调在色调表中远离基准色调。

(四)典型的五种配色原理

1.基于色相的配色。

基于色相策划了一个配色方案时,获得的效果通常会比较华丽明艳。此方式在拉丁美洲和亚洲使用最为广泛。适当地搭配好补色可以突出显示颜色并给人轻快的感觉,适当地搭配好类似色相可以获得整齐宁静的效果。

特点:可以获得稳定的变化效果。

¤补色与相反色相配色:强烈而鲜明的效果。

¤类似色相配色:冷静而稳重的感觉。

(A)相反色相、类似色调配色。

当使用了对比度较高的鲜明(Vivid)色调时,所使用色相效果将被突出从而得到较强的动态效果;当使用了对比度较低的黑暗(Dark)色调时,即使使用了多种不同的色相也能够得到较安静沉重的效果,这是因为使用暗色调时色相差异也会变得不太明显。

特点:静态的变化效果。

¤补色与相反色相配色:强调效果,轻快的气氛。

¤类似色相配色:整齐、安静的感觉。

TIP:

背景色:用于背景的颜色。

主颜色:主要颜色,起到在整体上显示出站点整体内容和风格的重要作用。

辅助颜色:辅助主要颜色的次要颜色,用于协助主颜色凝造整体气氛。

突出颜色:用于突出、强调显示,主要使用于占用范围较小的按钮、标签等处。

(B)相反色相、相反色调配色。

得到的效果具有强烈的变化感和逆向性。如果说类似色调配色方案能凝造出整齐的氛围,那么相反色调配色凝造出的就是一种强弱分明的氛围。影响这种配色方案效果的最大因素在于所选颜色在整体画面中所占的比例。

此方案通常用于突出显示较暗背景中的某一个较亮对象。

特点:变化感和逆向性。

¤需要根据颜色的色相与色调调整所占比例的大小。

(C)非彩色和彩色

非彩色主要由白色、黑色以及过渡阶段中的灰色构成,在与彩色搭配使用时,可以起到突出彩色的效果。通过搭配使用高亮度的彩色和白色以及亮灰色,可以得到明亮轻快的效果。而低亮度彩色和黑色以及暗灰色,可以得到黑暗沉重的效果。

特点:当非彩色的范围较大时可以凝造宁静的氛围。

¤高亮度配色:轻快的感觉。

¤低亮度配色:沉重的感觉。

2.基于色调的配色。

3.渐变配色。

4.Separation配色----强弱对比效果。

5.重点突出配色----强调突出效果。