以前总是没搞明白页面的配色规律，因为总是以为秘密藏在RGB的调配之中（受了韩国鬼子的误导）。最近决定去配色的HSB（色调、饱和度和亮度）里面去看看能否总结出什么规律，结果非常幸运，发现了网络用色的秘密。其实这个秘密可以一言蔽之：一切以饱和度为转移。

页面的主要配色元素是大背景、文字背景、文字和细线边框，我们逐一分析一下。照片有另外功用，以后再说。

主背景的配色规则
很多欧美网页，不用图片，单单凭借颜色的选定就可以使背景变得非常有内涵。我这个东施倒是一直努力效颦，但是不管怎么效都不像，感觉非常所失败。今天发愤用功，把优秀页面的背景色作了一个量化分析，把各自的RGB颜色和相对应的色相(hue)、饱和度(saturate)以及亮度(brightness) 列表对比，终于发现了其中的秘密。

原来背景选色的重点不在于RGB颜色的调配，也不在色相或者亮度，关键是在于饱和度。通过背景颜色的归纳，基本上可以断定，优秀的背景选色（黑白除外），色相和亮度都有很大区别，但是其饱和度非常接近，集中于0到10与90到100之间，间或有13、25、33、81之类的接近，但是极少出现50左右的饱和度。

我想大概是50左右的饱和度很难同其他颜色形成对比的缘故，而制造高对比度则是背景色的主要功用。

文字背景
以上所说的是大背景，主要是body的背景问题。接下来我们看一下文字背景，会发生什么事情呢？是跟主体背景的配色规律一样，还是另出心裁？
既有一样的，也有不一样的。
一样的地方在于，正文区域，也就是文字比较多比较小的区域，背景的饱和度也是分布于两个极端，要么是极小（接近纯白、灰或者黑），要么极大（这时候一般配接近白色的文字）。文字背景的饱和度分布，甚至比主背景还要极端。相比较而言，主体字体本身也是处于饱和度的两端。
但是标题文字的背景经常会遇到饱和度居中的情况，也就是说故意减少标题（尤其是h2）同其背景的差异。但是这好像并没有妨碍标题的醒目程度，因为标题字体一般比较大。标题字体的饱和度分布同样居于两个极端。

边框的颜色
细线1px边框非常常见，除了白色的以外（彩色背景上），最为常见的边框，无论是实线还是虚线，饱和度都非常极端，最常见的是饱和度为0！也就是说，大部分边框是灰色的，少数深色边框（配合深色背景）饱和度接近100，还有一些是接近零。灰色边框里面，亮度集中在60～80之间。总而言之，如果用饱和度为 0，亮度在60～80之间的颜色作细线边框，在背景为浅色的情况下非常安全。

在此基础上，才谈得上相近配色和对比配色。三原色为红黄兰，每种颜色的对比色就是其他两种颜色的混合色，而相近色就是本身与其他颜色的混合色。其中有些颜色比较特殊，好比灰色和橙色功用就非常多。灰色可以跟大部分颜色配合，而橙色在大多数颜色中都显得非常跳跃。