文章内容整理自：设计玩家的《设计心经》，感兴趣的小伙伴可以购买正版书籍进行研究学习。设计玩家论坛；涉及到的图片案例采用工具：ps、colourimpact、ai  制作

HSB对应的三个色彩属性：

H：Hues  ——色相

S：Saturation——饱和度

B：Brightness——亮度

1. H ——色相

可以理解成初中物理上的七色：红、橙、黄、绿、青、蓝、紫。更浅显易懂的就是直接看色轮

如上图所示：这个色轮一共有12格，从顶部12点钟方向开始，依次按照红、橙、黄、绿、青、蓝、紫彩虹七色排序。

【色环】下拉列表里有：艺术\科学两个选项。艺术色轮是人为的把集中颜色平均分布到色轮里； 科学色轮是按照可见光谱来划分区间的。

两者的区别：

艺术色轮可以理解为艺术家绘画用的调色盘，一个圆形的盘子，分成12格，每格放一种颜料。每个格子所占的比例是均分的。

科学色轮可以理解为科学家做实验用的色轮，该色轮来自于牛顿的三棱镜实验：阳光透过三棱镜，可以分解出7中可见光，我们把这个“彩虹”叫做“可见光谱”，注意这几种颜色在光谱上是不等分的，有的颜色占得地方多，有的颜色占得地方小。如下图所示：

2. S——饱和度

饱和度是指颜色的强度和纯度

饱和度是表示色相中彩色成分所占的比例，用0（灰色）~100（完全饱和）的百分比　来度量。在标准色轮上饱和度是从中心逐渐向边缘递增的。HSB之间相互影响，拖动其中一个滑块，都会跟着相应的变化。举个例子来加深一下对于饱和度的理解：

ps中可以通过调整透明图来感受色彩的饱和度

在CI里可以通过调整饱和度的值来观察饱和度的变化，如下图所示：图片依次为：饱和度20%、40%、80%、100%

3. B——亮度

亮度是颜色的相对明暗程度，感受就如同从白天到黑夜...

用中国人的思维描述亮度饿的时候通常是用比较暗、比较亮、不太暗、不太亮、再亮一点、再暗一点...这些词，这种主管而笼统地描述往往让人无所适从。

如何“量化思维”呢？在HSB模式里边，亮度是从0（黑）~100（白）的百分比来度量的。

下图所示的小实验，主要为了方便大家对于亮度的理解：

同样在CI中进行测试。下图分别为：0%、40%、80%、100%

4. PS中的HSB模式

ps中的HSB与CI中的HSB是完全一致的，他们两个是最佳拍档。

色相

饱和度

亮度