十六进制颜色代码,了解一下

作为设计师,我们经常用RGB的颜色模式来做图。我们在看别人设计稿的时候,也经常会看到一串颜色代码。我们都知道RGB代表红色,绿色和蓝色,只有这三种颜色用于再现数字画布的所有其他颜色。十六进制颜色代码是6位颜色代码,前缀为哈希(#),用于保存数字颜色信息。十六进制颜色代码都是怎么样的呢?今天我们一起了解一下。

RGB表示法实际上也是三个参数:

R:饱和度为100%的红(0°)色的亮度值;

G:饱和度为100%的绿(120°)色的亮度值;

B:饱和度为100%的蓝(240°)色的亮度值;

从小我们就知道,白光有7种颜色,光只有三种颜色,红、绿、蓝,其他的各种颜色都是由这三种颜色不同比例混合而成的。那么究竟怎么混合呢?就是下图中右边的相环。这三种颜色之间1:1配比可形成间色,而不等比例就会形成偏混色。

色环

那么十六进制颜色代码跟RGB的色值怎么联系呢,其实这串代码指的就是颜色色值本身。也就是说,这串6位数的代码,实际上使用三组2位十六进制数表示了RGB的色值,如下图:

十六进制-rgb

十六进制颜色代码保存0到9之间的数字值以及从A到F的字母值,其中0类似于暗度,F类似于亮度。

除此之外,F表示色相,0表示没有色相。下图显示了红色通道的饱和度。


如上图所示,明度和饱和度从0增加到F,然后以相反的方式减小。十六进制颜色代码#000000描绘了明度的消耗和完全变黑,而代码#FFFFFF描绘了明度和饱和度的增加。在十六进制颜色代码中,前两位数代表红色通道,第三和第四代表绿色通道,后两位代表蓝色通道。

我们假设六位数为红色,红色,绿色,绿色,蓝色和蓝色。最大值决定产生的颜色是否为红色,绿色或蓝色; 最小值决定该颜色的色调或阴影。具有较高值的数字更明亮且饱和,而具有较低值的数字较暗且不饱和度。


可能说了这么多大家还不明白。我从大神的经验中获取了以下4条规律:

1.如果RGB的三种色值大小相近,那么该颜色的饱和度偏低;

2.RGB的色值中,最大的一个或最大且相近的两个色值决定色相;

3.RGB的色值中,最大的色值决定亮度(最大值越大越亮)

4.RGB的色值中,最小值决定饱和度(同一最大亮度下最小的数值越大饱和度越低)


举个栗子1

十六进制颜色代码#3F51B5,三个色值分别为3f,51,B5;不难看出,最大值是b5,所以这个色相偏向蓝色,再看b5中的b不是很高(最高为f),他是一种中亮度的蓝;再看最小值,是红色的f很大,会中和一部分蓝,所以整体会偏紫色一点。示例可以在下面的图形表示中看到。

举个栗子2:描述#1ef32a所表示的颜色:

分析:三个色值分别是1e,f3,2a;不难看出,最大值是f3,这个值很接近最大值ff,说明整体的亮度是一个“高亮度”;

最小值1e和最大值f3相差甚巨,也就是说,最小值对于最大值并没有什么影响,由此可以断定,饱和度是一个“高饱和”;

次大值2a跟最大值也相差巨大,也就是说,次大值跟最大值很难混合成偏混色,也就是整体的色相由f3决定了,f3正好是绿色的色值,因此:

该色彩是一个高亮度、高饱和度的绿色。


在颜色代码#FF0000中,红色通道的最大值和最小值均为F,代表最亮的色相和饱和度。其他两个通道的数字为0,这将描绘色调的消耗和亮度的零值,因此RGB模型中的解释颜色将是更亮的红色。

以非常类似的方式,#00FF00和#0000FF十六进制代码的解释结果将分别为绿色和蓝色。

让我们看看一些更多的十六进制颜色代码,只要RGB模型中的两个通道处于最亮的水平,就会对其进行解释。

黄色 - #FFFF00   洋红色 - #FF00FF   青色 - #00FFFF

如果十六进制颜色代码写为“#FC3”,则将其解释为“#FFCC33”。

如果十六进制代码数字的所有值都相同,则会产生灰色调。


可能大家会觉得非常的难,其实还是有比较简单的方法的。

比如,以色彩#357fd2为例:

第一步,将三个色值分开:

第二步,用“七舍八入”的方式取整(七舍八入,是因为在十六进制中,7和8才是位于中间的两个数字):

第三步,把末尾的0去掉

第四步,把十六进制转化为十进制

第五步,估算亮度

本例中,用13/16≈81.25%,高亮度(每隔20%一个等级,20以下为低,20~40为中低,40~60为中,60~80为中高,80以上为高,饱和度也同理);

第六步,估算饱和度

本例中,用1-3/13≈76.9%,中高饱和度;

第七步:评定色相

结果接近0为原色(最大值所代表的颜色),结果接近于1为间色(最大值与中间值等值混合),结果接近于0.5为偏混色(最大值与中间值2:1混合)。本例中,(8-3)/(13-3)=0.5,偏混色(蓝多绿少,靛蓝);

但是这种方法纯属于估算,还是会存在一定的偏差。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,711评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,932评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,770评论 0 330
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,799评论 1 271
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,697评论 5 359
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,069评论 1 276
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,535评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,200评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,353评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,290评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,331评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,020评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,610评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,694评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,927评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,330评论 2 346
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,904评论 2 341

推荐阅读更多精彩内容