品牌蓝不是 #0000FF:Intel、LinkedIn、IBM 和 Dell 如何用蓝色
纯蓝印出来更灰,看起来像链接,在黑底上还难以辨认。那些著名的蓝色 Logo 用的都是更沉稳的蓝。本文给出它们的确切色值,解释 Facebook 和 Visa 的蓝为何在印刷中偏色,并教你选出自己的蓝。
好的品牌蓝绝不会是 #0000FF。纯蓝是屏幕能显示的最深的蓝,听起来很有力量,直到 Logo 拿去印刷,印出来变得更灰,或者放到网页上,每个蓝色的东西都像链接。那些著名的蓝色 Logo 都用同一种方式解决了这个问题,而且这个规律很容易照搬到你自己的品牌上。
为什么纯蓝很难搞
纯蓝是屏幕色彩空间的一个角落:蓝光全功率输出,别的什么都没有。印刷油墨到不了这个角落。
屏幕上
铜版纸印刷
按标准铜版纸印刷转换后,#0000FF 变成 CMYK 93/75/0/0,打样大约是 #2C4A9A:更灰,更平。这个差别大到训练有素的眼睛会认为是另一种颜色,所以你名片上的蓝和网站上的蓝对不上。
纯蓝在黑底上还有第二个问题。它是所有亮色里最暗的,所以蓝色文字或蓝色标志放在深色背景上几乎消失。
白底上
黑底上
它还像个链接
浏览器默认链接色
纯蓝
浏览器把未访问的链接涂成 #0000EE,出自 HTML 标准建议的样式表。这离 #0000FF 只差一步,所以纯蓝的 Logo 或按钮看起来像是该点击的东西,或者像是忘了加样式。
著名的蓝是怎么做的
Intel:#0068B5
清澈的中蓝,从纯蓝向青色偏了约 34 度。它的印刷打样与屏幕色的 Delta E 只有 0.8,小到看不出来。Intel Logo 在这个蓝上反白使用,白字很容易读。
LinkedIn:#0A66C2
友好的蓝,比 Intel 多一点紫。四个里它印刷偏移最大,Delta E 为 2.0,但仍处在眼睛刚好能察觉的边缘。字标和方块变白,“in”镂空成蓝色。
IBM:#1F70C1
稳重、略柔和的蓝,带一点灰。条纹字母很细,所以颜色必须足够浅,白线才读得清:白色在这个蓝上轻松超过文字无障碍的最低要求。印刷 Delta E 为 1.3。
Dell:#007DB8
四个里最浅、最偏青的一个,来自 Dell 2016 年的品牌更新。这是这里最干净的蓝,离纯蓝 41 度,印刷偏移在 0.9 Delta E 以内。它也是白字余量最小的:能通过对比度检查,但只是刚好。
它们都做对的三件事
它们偏向青色。 纯蓝在色轮上位于 240 度,默认链接色也是。Dell 在 199,Intel 在 206,LinkedIn 和 IBM 在 210。离 240 度偏 30 到 40 度,蓝色就变得沉稳,也不再像超链接。
它们在白底和黑底上都能用。 纯蓝在白底上强,在黑底上沉。这四个蓝处在明度范围的中间,所以白字在所有蓝上都能通过,每个蓝在深色背景上作为颜色也依然可见。
它们印得准。 每一个的打样偏移都在 Delta E 2.0 以内。
| 品牌 | 蓝色 | 色相 | 其上的白色文字 | 作为黑底上的颜色 | 印刷偏移 |
|---|---|---|---|---|---|
| 纯蓝 | #0000FF | 240° | 通过,8.6 比 1 | 不通过,2.4 比 1 | 大,16.6 |
| Intel | #0068B5 | 206° | 通过,5.8 比 1 | 通过,3.6 比 1 | 看不出,0.8 |
| #0A66C2 | 210° | 通过,5.7 比 1 | 通过,3.7 比 1 | 小,2.0 | |
| IBM | #1F70C1 | 210° | 通过,5.1 比 1 | 通过,4.1 比 1 | 小,1.3 |
| Dell | #007DB8 | 199° | 通过,4.5 比 1 | 通过,4.6 比 1 | 看不出,0.9 |
印刷偏移低于约 2 很难看出来。高于约 5,印出来的颜色就像另一种蓝。
印刷中确实会偏色的蓝
通过屏幕检查还不够,因为印刷是另一场考试。用同样的方法测量,另外三个著名的蓝在铜版纸印刷上偏移很大。
| 品牌 | 蓝色 | 色相 | 其上的白色文字 | 印刷偏移 |
|---|---|---|---|---|
| #0866FF | 217° | 通过,4.8 比 1 | 大,9.7 | |
| Visa | #1434CB | 230° | 通过,8.8 比 1 | 大,9.2 |
| Samsung(引用值) | #1428A0 | 231° | 通过,11.4 比 1 | 明显,6.0 |
Facebook 的蓝最有意思。它处在偏青的范围内,也通过了白字检查,但打样出来仍然明显是另一种蓝。
更亮、更饱和的蓝超出了四色油墨能印出的范围。这些品牌有各自的理由,而且大多活在屏幕上,所以这是一次测量,不是失误。给你的 Logo 的教训是:去做印刷打样,别只凭色相猜。
如何为你的 Logo 选一个蓝
- 从离纯蓝 30 到 40 度的位置开始。 把 #0000FF 往青色拉,直到落在约 199 到 210 度之间,也就是这四个著名蓝所用的范围。
- 三种方式测试。 其上的白字在正文字号下要容易读。颜色本身在黑底上仍要看得见。并且放在 #0000EE 旁边不能像链接。
- 印刷打样。 在设计工具里用铜版纸色彩配置文件做软打样,或者向印刷商要一份样张。如果印出来的蓝像另一种颜色,就调整它,直到屏幕和印刷一致。
偷走这 4 个蓝
这四个蓝,就是各品牌实际画出来的样子。
拿它们来学习,并把你自己的蓝放在旁边对比测试。在相关行业的新 Logo 上照抄著名品牌的确切蓝色,只会让你看起来像山寨:用规律,别用色值。
FAQ
Intel 蓝的 hex 色值是多少?
Intel 蓝是 #0068B5,取自 Intel 的 Logo 文件。
LinkedIn 蓝的 hex 色值是多少?
LinkedIn 蓝是 #0A66C2,取自 2021 年的 LinkedIn Logo 文件。
IBM 蓝的 hex 色值是多少?
IBM 蓝是 #1F70C1,取自 IBM 的 Logo 文件。
Dell 蓝的 hex 色值是多少?
Dell 蓝是 #007DB8,取自 2016 年品牌更新后的 Dell Logo。
为什么 #0000FF 不适合做 Logo?
它印出来明显比屏幕上更灰,和浏览器默认链接几乎是同一种蓝,而且在黑底上几乎消失。一个更沉稳、偏向青色的蓝能同时解决这三个问题。
浏览器中默认链接是什么颜色?
在 HTML 标准建议的样式表中,未访问的链接是 #0000EE,离纯蓝只差一步。
什么样的蓝适合做 Logo?
色相在约 199 到 210 度之间的中蓝,就像 Intel、LinkedIn、IBM 和 Dell 的蓝:能通过白字检查,在黑底上依然可见,印刷打样的 Delta E 在约 2 以内。
来源
- 颜色取自 Wikimedia Commons 上各品牌的 Logo 文件:Intel logo (2020)、LinkedIn (2021)、IBM、Dell (2016)。
- 默认链接色:HTML 标准的渲染部分,其中
:link为#0000EE。 - 印刷偏移:在 Coated FOGRA39 印刷配置文件上做软打样,按 Delta E 2000 测量。#0000FF 打样为 #2C4A9A,差值 16.6。四个著名的蓝偏移在 0.8 到 2.0 之间。Facebook 的 #0866FF、Visa 的 #1434CB 和 Samsung 引用的 #1428A0 分别偏移 9.7、9.2 和 6.0。
- 色相角度由 hex 色值按 HSL 模型计算。白字在颜色上、颜色在黑底上的比值按 WCAG 2 对比度公式计算。
- 每个 Logo 都以反白形式显示在自己的蓝色上,也就是这些品牌在其品牌色上使用的版本。仅重新着色,从未重绘,商标归其所有者所有。
- 最初作为轮播图发布于 Logo Brainy。
Choosing colors for a new logo? Our team designs brand identities with colors that work on screen, in print and next to each other.
Get Started
