网站设计的网页色彩概论 - 北京传诚信

色码表英文为Color code table，是网站设计师在做设计时，挑选颜色常常会用到的参考表，通常使用颜色有三种不同的写法，分别是使用颜色的英文名称、十六进位色码以及RGB、HSL、Hex...而网站设计师通常是使用的16进位色码比较多。

以下针对颜色先来做个基本介绍

RGB

三原色光模式（RGB color model），又称RGB颜色模型或红绿蓝颜色模型，是一种加色模型，将红（Red）、绿（Green）、蓝（Blue）三原色的色光以不同的比例相加，以合成产生各种色彩光。

而网站主要使用的为sRGB，sRGB 色域较小，一般我们的电脑萤幕仅能显示sRGB 色域，因此较适合用于网站设计，一般的电脑萤幕、软体、相片冲印的预设状态都是以sRGB为预设值。

每像素24位元

每像素24位元（bits per pixel，bpp）编码的RGB值; RGB色彩在网站设计时的标记方式是RGB(0~255 , 0~255, 0~255)，其中括弧内以逗号分隔的三组数值恰好就是(R, G, B) 的色彩数值，所以数值会是0~255 共256个数值的这个区间

(0, 0, 0)是黑色

(255, 255, 255)是白色

(255, 0, 0)是红色

(0, 255, 0)是绿色

(0, 0, 255)是蓝色

(255, 255, 0)是黄色

HSL色彩( HSL color )

HSL色彩是通过对H（hue）色相，S（saturation）饱和度，L（lightness）亮度。三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的，HSL即是代表色相，饱和度，明度三个通道的颜色,取值范围是0°～360°的圆心角，每个角度可以代表一种颜色。

H（hue）色相

360°/0°红、60°黄、120°绿、180°青、240°蓝、300°洋红

S（saturation）饱和度

0%～100%的值描述了相同色相、明度下色彩纯度的变化。数值越大，颜色中的灰色越少，颜色越鲜艳，呈现一种从理性（灰度）到感性（纯色）的变化. 

L（lightness）亮度

0%～100%的取值范围。数值越小，色彩越暗，越接近于黑色；数值越大，色彩越亮，越接近于白色 

网站16进位色彩( hex color )

在HTML和CSS中使用3位元组共6个十六进制数字表示一种颜色，每位元组从00到FF，相当十进位数字从0到255，按顺序前两位是红色的值，中间两位是绿色的值，最后两位是蓝色的值。16进位码的色彩标示是由一个井号（＃）开始，在接着后面带6个数字来表示。

0 代表最低

8 代表中间

9 之后是 A

F 代表最高

FF为最大数，代表十进制255。比如白色是R、G、B三个颜色最大，在网站代码便是：#FFFFFF。黑色是三个颜色为0，在网站代码便是：#000000。

使用范例:

#000000 -黑色-三组的两个数字皆为 0

#FFFFFF  -白色-三组的两个数字皆为F

#FF0000  -红色-纯粹红色的最高值，所以前两个数字为F，因为不包含任何的蓝色与绿色，所以后两组的两个数字为0

#0000FF  -蓝色-纯粹蓝色的最高值，所以后两个数字为F，因为不包含任何的红色与绿色，所以前两组的两个数字为0

#00FF00  -绿色-纯粹绿色的最高值，所以中间两个数字为F，因为不包含任何的红色与蓝色，所以前后两组的两个数字为0

#FFFF00  -黄色-纯红色与纯绿色的结合，所以前两组的两个数字为F