gackthang 发表于 2014-12-16 00:37:36

1-7 HSB色彩模式

      前面我们已经学习过了两大色彩模式RGB和CMYK。色彩模式有很多种，但这两种是最重要和最基础的。其余的色彩模式，实际上在显示的时候都需要转换为RGB，在打印或印刷(又称为输出)的时候都需要转为CMYK。虽然如此，但这两种色彩模式都比较抽象，不符合我们对色彩的习惯性描述。比如下面这幅图像，如果问：图中人物衣服颜色的RGB或CMYK值是多少？你一定会觉得不得其所。如果现在要你在RGB模式下组合出一个浅绿色，也很难准确地做到。
其实Photoshop和Illustrator以及GoLive的取色滑块都提供了色彩预见功能，即动态颜色滑块(可在【编辑 首选项】的常规选项中打开或关闭)。如下中图 ，可以预见：将R滑块往右拉就会得到粉红色；把B滑块向左拉会得到草绿色；把G滑块向右拉就可以得到浅绿色。但这种方式还是不够直观，最重要的是不方便修改，比如目前的蓝色，想要得到更浅更亮的蓝色，需要拉动三个滑杆才能得到，如下右图。

http://pic.16xx8.com/allimg/141215/052535G16-0.jpg

http://pic.16xx8.com/allimg/141215/052535G16-0.jpg
?
http://pic.16xx8.com/allimg/141215/0525353N5-2.jpg

http://pic.16xx8.com/allimg/141215/0525353N5-2.jpg
?
http://pic.16xx8.com/allimg/141215/052535BB-4.jpg

http://pic.16xx8.com/allimg/141215/052535BB-4.jpg

习惯上我们都会说图片上的衣服是黄色的。或者说是亮黄色的。比如晴空，我们首先想到蓝色，然后是浅蓝色。比如湖水，首先想到绿色，进一步想到碧绿色。我们大脑对色彩的直觉感知，首先是色相，即红色橙黄色绿色青色蓝色紫中的一个，然后是它的深浅度。
HSB色彩就是籍由这种模式而来的，它把颜色分为色相、饱和度、明度三个因素。注意它将我们人脑的“深浅”概念扩展为饱和度(S)和明度(B)。所谓饱和度相当于家庭电视机的色彩浓度，饱和度高色彩较艳丽。饱和度低色彩就接近灰色。明度也称为亮度，等同于彩色电视机的亮度，亮度高色彩明亮，亮度低色彩暗淡，亮度最高得到纯白，最低得到纯黑。
如果我们需要一个浅绿色，那么先将H拉到绿色，再调整S和B到合适的位置。一般浅色的饱和度较低，亮度较高。如果需要一个深蓝色，就将H拉到蓝色，再调整S和B到合适的位置。一般深色的饱和度高而亮度低。如下左图和中图。这种方式选取的颜色修改方便，比如要将深蓝色加亮，只需要移动B就可以了，既方便又直观。
如果要选择灰度，只需要将S放在0%，然后拉动B滑杆就可以如同灰度模式那样选择了。如下右图。注意，HSB方式得到的灰度，与灰度滑块K的数值是不同的。我们在Photoshop中选择灰度时候，应以灰度滑块为准。

http://pic.16xx8.com/allimg/141215/0525352J4-6.jpg

http://pic.16xx8.com/allimg/141215/0525352J4-6.jpg
?
http://pic.16xx8.com/allimg/141215/0525352346-8.jpg

http://pic.16xx8.com/allimg/141215/0525352346-8.jpg
?
http://pic.16xx8.com/allimg/141215/05253531L-10.jpg

http://pic.16xx8.com/allimg/141215/05253531L-10.jpg

在HSB模式中，S和B的取值都是百分比，唯有H的取值单位是度，这个度是什么意思？是角度，表示色相位于色相环上的位置，将我们前面学过的色相环加上角度标志就明白了。
如下左图。从0度的红色开始，逆时针方向增加角度，60度是黄色，180度是青色等等。360度又回到红色。可以自己调节H滑块对照一下。需要注意的是，由于在Photoshop的HSB模式中只能输入整数，因此能够选择的色彩数量是360万种。虽然在数量上不及RGB模式，但对于我们来说也是足够使用了。
我们再看一下Photoshop的拾色器，拾色器的H方式其实就是HSB取色方式。色谱就是色相，而大框就包含了饱和度和明度(横方向是饱和度，竖方向是明度)。如下右图。

http://pic.16xx8.com/allimg/141215/0525351S6-12.jpg

http://pic.16xx8.com/allimg/141215/0525351S6-12.jpg
?
http://pic.16xx8.com/allimg/141215/0525354531-14.jpg

http://pic.16xx8.com/allimg/141215/0525354531-14.jpg

可以看出，在选取颜色的时候，HSB模式较为直观和方便。在Illustrator和GoLive中也是如此。
教程编号:0 作者：赵鹏 出处：网络

Undo 发表于 2019-6-20 11:01:54

我的作业：

PS火箭猫 发表于 2019-7-20 00:38:52

我的作业：

从前从前h 发表于 2019-7-27 21:15:21

H=360   S=100(%)B=100(%)
H*S*B=360w种因为色相 饱和度和亮度3个是组合出一个色彩

从前从前h 发表于 2019-7-27 21:26:13

我的作业：其他的作业是S拖到最左B最左H的色相无亮度始终为黑色   s最左B最右(或其他位置非最左)   拖动H的色相 无饱和度始终为白色得到只有当S,B均存在时,色相才能被表现出来

天上的飞鹰 发表于 2019-7-29 17:39:13

我的作业：

问_ 发表于 2019-8-1 15:59:08

我的作业：

LOL11111 发表于 2019-8-16 15:36:25

我的作业：

黑孩不黑 发表于 2019-8-18 20:12:29

我的作业：每天都能学点新知识，很有成就感

涛小子 发表于 2019-11-26 10:55:48

我的作业：终于明白HSB是怎么个工作模式了，感谢教程!

少年感X 发表于 2020-3-7 17:47:06

学习到了，HSB：H色相，S饱和度，B明度

一枚PS小白 发表于 2020-3-23 10:29:19

我的作业：

金金616 发表于 2020-4-30 09:19:50

我的作业hubh色相u饱和度b亮度明度

狂野气息 发表于 2020-5-27 15:28:26

我的作业：

啦啦啦服饰 发表于 2020-6-6 10:28:18

我的作业：
页: [1] 2
查看完整版本: 1-7 HSB色彩模式