如果你制作了一张图表,很可能你现在想要的是美丽、易于接触且合适的颜色。我们已经介绍了如何为数据可视化选择更美的颜色,以及在为组织风格指南创建色彩调色板时应考虑的事项。以下文章更为实用。它解释了你可以使用哪些工具和方法来寻找、设计或扩展色彩调色板:
在哪里可以找到好的色彩调色板:使用工具中的默认颜色 |使用他人创建的色彩调色板进行数据可视化 |使用他人创作的色彩调色板 |从其他数据可视化中选择颜色 |从其他作品中挑选颜色
如何创建新的调色板:使用生成调色板以实现数据可视化的工具 |使用基于色轮|调色板生成器 |问问大型语言模型(比如ChatGPT或Claude) |循环色彩调色板生成器 |从渐变中选取颜色 |先定义明度和饱和度,然后选择色相 |不要用额外的工具
如何扩展现有的调色板:通过混合两种颜色找到第三种颜色 |从使用你色彩的图片和设计中汲取灵感
如何提升你的色彩调色板:通过融合颜色统一 |用工具检查颜色 |给它点时间
在谈论工具之前,让我们先提醒自己这些要求。有很多漂亮的颜色组合,但并非所有都适合你的数据可视化。即使是那些在其他可视化中有效或被包装为“数据可视化色彩板”的颜色,也可能不适合你的情况。
你最终调色板中的颜色应该:
→ 从你的背景中脱颖而出。爱上粉彩黄毫无意义——如果你是在白色背景上画折线图。你可能还需要遵循WCGA的色彩对比度。
→ 彼此区分开来。深紫色和深蓝色⬤⬤?两种颜色都很漂亮,但很难区分,尤其是小尺寸时。有些色彩调色板对大区域来说过于饱和,因为它们是为线条和点设计的。
→ 色盲者也要有区别! 在选择亮度相近的红色和绿色之前,请三思。
根据你的使用场景,颜色也应该......
→ 拥有不同的轻盈。” “把它写得好”,尤其是当你的可视化会以黑白印刷时。但即使没有,这也能很好地表明你的颜色对任何类型的读者来说都很容易区分。
→ 与主题相符,唤起正确的联想——或者根本没有联想。 你可能想避免强烈的红色(“危险!”)、草绿色(“好”)以及你文化中带有意义的其他颜色。如果不确定,可以考虑混合色代替纯色。
→ 看起来差不多重要。 如果你选择的调色板中几种颜色突出,务必确保它与你的分类相符。例如Colorbrewer的“配对”调色板:⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤。顾名思义,它适合类别对(例如两个不同年份的不同行业),但如果所有类别都应具有相同的视觉重要性,效果就不那么理想。在本文中,我们追求的颜色同样重要。
通常不需要重新发明(颜色)轮子。以下是一些寻找与图表或地图相符的现有调色板的建议。
获得可行色彩调色板的最简单方法是使用你数据可视化工具的默认颜色。许多工具有一个或多个独特的默认色彩调色板。以下是一些常见数据可视化工具的当前色彩调色板:
<datawrapper-visualization-fc9a2473 style="box-sizing: inherit;"></datawrapper-visualization-fc9a2473>
| ⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤ | |
| ⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤ | |
| ⬤⬤⬤⬤⬤⬤⬤⬤ | |
| ⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤ | |
| ⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤ | |
| ⬤⬤⬤⬤⬤⬤⬤⬤⬤⬤ | |
| ⬤⬤⬤⬤⬤⬤ |
这些调色板大多从左到右添加新色彩。所以如果你的可视化只需要一种颜色,比如简单的条形图,它会显示为中深蓝色——无论用什么工具。你问为什么?因为蓝色是很多人都能认同的颜色。它轻松通过了WCAG的色彩对比度检测。而且它与橙色搭配时非常适合色盲——橙色是所有工具中第二或第三类的颜色,但Keynote那个有缺陷。
如果你想知道Excel/PowerPoint调色板中的深色:它是唯一通过WCAG色彩对比度检测的,背景是白色背景,所以无障碍似乎是这里的优先级。
有些工具有动态默认调色板,会根据类别数量变化颜色。R库ggplot2就是一个例子。如果你创建一个需要两种颜色的 ggplot2 可视化,它会显示浅红色和青绿色 ⬤⬤。如果你的可视化需要三种颜色,则会显示红色、绿色和蓝色⬤⬤⬤。使用四种颜色,它显示的是相同的红色、更橄榄绿、青绿色和紫色⬤⬤⬤⬤。
市面上有很多专门为数据可视化设计的色彩调色板。Cynthia Brewer的ColorBrewer,自2002年起就存在(!),可能是最著名的一个:

你可以在工具底部过滤掉不适合色盲的调色板——但如果这样做,你会发现调色板只能有四种颜色。对于大而易用的色彩调色板,ColorBrewer 帮不上什么忙。
但这也不是唯一的选择。关于色彩调色板的数据非常多——基于碧昂丝的照片、泰勒·斯威夫特的专辑封面、韦斯·安德森电影、星际迷航主题、哈利·波特的房屋、荷兰艺术、伊斯兰艺术、美国国家公园的海报和照片等等。它们大多是 R 软件包(全部都收录在 R 套件调色板中),但你也可以直接从文档页面或 Emil Hvitfeldt 的 Discrete Color Palettes 或 Yan Holtz 的 Python Color Palette Finder 等工具中选择颜色,并用在任何工具中。

每一个专门为数据可视化设计的色彩调色板背后,还有成千上万种为其他设计目的而设计的。他们太多太多了。你可以在ColorHunt、ColorDrop、Coolors、LOLcolors、Pigment和Adobe Color等平台上找到它们。
还有整本色彩调色板的书供你复制。对于数字作品,它们的使用有限:这些调色板是用CMYK打印的,因此无法显示RGB中所有可用的颜色。如果书中包含RGB和HEX代码,它们在数字可视化中看起来会更饱和。
许多这些色彩调色板,无论是印刷还是数字,都有问题:它们被设计成适合那些重要元素较少但更重要的场景。在室内设计或UI设计中,这很常见——几种去饱和的颜色可以作为墙面或网站背景色,再加上一些点缀色,用于沙发桌或行动按钮。

对于你的分类色彩调色板,你通常不希望重要性差异如此巨大。

获得可用色彩调色板的另一种简单方法是直接复制其他设计良好的数据可视化方案。下次看到色彩鲜艳的可视化时,记得保存一下。以后需要颜色时,可以从你的小图表库里用颜色选择器挑选。
如何选择颜色?你可以在在线工具或专业设计工具如Figma、Photoshop中选择数据可视化的十六进制代码。还有一些应用可以让你定义快捷键,然后打开颜色选择器,比如Pika。如果你在屏幕上任何地方点击它,它会把颜色保存到剪贴板上,作为十六进制或RGB代码。然后你可以把颜色粘贴到任何地方。
请记住,你复制的可视化设计者可能花了不少时间设计他们的颜色。给设计师发一条简短消息,问问他们是否同意你使用他们的调色板,并在图表或页面的页脚注明他们。你也可以从其他可视化作品的色彩主题或色彩氛围中获得灵感,而不是直接复制实际的十六进制代码。
我们周围充满了色彩——往往是彼此契合的颜色。那为什么不挑选其中一些呢?灵感源源不断。你可以从艺术品、(包装)设计、电影剧照等多种内容中选择颜色:



你甚至可以直接从周围的世界挑选颜色——游乐场、室内设计杂志、超市、大自然——比如Adobe Capture等应用,让你从自己的照片中采样颜色。
如果你想更进一步,甚至可以不用任何工具就选颜色。如果你被朋友公寓里那面青柠绿和深蓝色的墙壁启发,回家后试着凭记忆重现那个组合。你可以通过回头检查颜色是否正确来训练你的眼睛和颜色记忆。(请记住,光线对颜色有很大影响,所以它们可能和上次不一样。)
你宁愿自己做一个调色板,而不是浏览成百上千个旧调色板,或者从有山和鹿的照片中挑选颜色?这一章是为你准备的。

是的,它们存在:专门为数据可视化创建分类色彩调色板的问题而设计的工具。我知道两个,哥伦比亚和达·芬奇。Colorgorical的“配对偏好”旨在让你找到“平均来看,预测搭配更美观的颜色”。这似乎导致你偏爱绿色和粉色——如果你不喜欢这些,可以过滤掉某些色调。

有不同的色轮“和谐”可以帮助你找到颜色——你可能记得学校美术课上学过的几种。Adobe Color 允许你设置一个基础色,然后根据互补、三和弦、方形和复合和弦推荐其他颜色。与许多其他工具不同,它允许你调节所有颜色的饱和度和亮度。
在Adobe Color中,我建议先从这些默认的颜色和谐中获得灵感,然后用“自定义”的调色来创建自己的。将色彩模式设置为HSB(“色相、饱和度、亮度”),以调节颜色的饱和度和亮度。(请记住,颜色的饱和度越高、亮度越不同,就越容易区分!)这是我用这个工具做一个好调色板的样子:
除了Adobe,还有Muzli Colors和>10年的Paletton。

提出一个大型语言模型的处理效果出乎意料地好。它有几个优点:无论需要多少颜色都能正常工作,你可以让工具考虑你的目标和可访问性问题(“所有颜色至少要达到3:1对白的对比度”),而且你可以重复运行以获得不同的效果。
像这样的提示对我很有效:“给我六种颜色,做一个带有复古氛围的数据可视化。所有颜色都应具有相同的视觉意义,即使在小尺寸下也应能很好地区分彼此。”将此提示交给ChatGPT后,生成了调色板⬤⬤⬤⬤和⬤⬤⬤⬤;克洛德给了我⬤⬤⬤⬤和⬤⬤⬤⬤。
你也可以让大型语言模型扩展你的调色板,比如:“给我四种颜色,适合我的数据可视化的分类调色板。所有颜色都应具有相同的视觉意义。”#FF7651#006C67

你可以用像Coolors或Colormind这样的调色板生成器来循环切换颜色,直到看到你喜欢的颜色。
在Coolors中,按空格键直到看到你想保留的颜色,然后锁定空格键,继续按空格键,直到你对五种颜色都满意为止。它还配备了色盲模拟器和调色板可视化器,可以在仪表盘模型中显示你的颜色。
Colormind也做同样的事,声称能用深度学习实现漂亮的组合(但没有训练数据可视化)。

像调色板生成器或渐变生成器这样的工具可以让你插入一个开始和结束的颜色,然后在它们之间生成颜色。如果你只想要几种颜色,或者想给大面积区域(比如条形图)上色,这方法值得一试。这种方法也有助于无障碍——只要确保你最亮的颜色对比度高于你想要或需要达到的对比度。
一个小建议:如果你把亮色作为渐变的起始色,最后选择深色、饱和的颜色。如果你从较深的颜色开始,最后的颜色可以设定为明亮且饱和的颜色,比如橙色或向日葵黄。

使用渐变生成器时,我建议选择色彩模式OKLCH或LCH。这些色彩模式比RGB、HSL或LAB更美观,正如这里所解释的。试试色相插值法——“短”意味着色调更少,“长”则是更多。
你想要更多设置?试试兰彭绍或波利内。

如果你想要非常有结构化的颜色选择,这款可能适合你。和之前的选项一样,它也非常友好——你不是先选定色调再检查它们如何搭配,而是先定义颜色允许的明暗度作为第一步。要“在黑白中做到完美”,可以为调色板中的每种颜色设置不同的明暗等级。(我选择了40%到80%之间的轻度,间隔是偶数,也就是40%、48%、56%、64%、72%和80%。)
深色更容易引起注意,所以我决定随着亮度下降调整饱和度,并稍微降低一点:颜色越深,饱和度越低。
剩下的就是色调。可以考虑使用OKLCH的色彩选择器和转换器——它能很好地显示每种亮度和饱和度的可用色调。(替代选择有这个和那个。)
我收集了所有喜欢的饱和度、亮度和色调组合,然后从每行中选出一种颜色作为最终的配色板:

另一种方法是基于HSV色彩模型中的曲线生成色彩渐变——这里有相关视频、文章和工具。不幸的是,这会导致颜色的重要性不同,这是我们想避免的。

你可以,嗯,即兴发挥。直接在你的数据可视化工具或你选择的图像编辑工具中,调整颜色直到你喜欢为止。
如果你尝试这样做,我们的博客文章《如何为数据可视化选择更美丽的颜色》将提供一些建议,比如使用允许你选择色相、饱和度和亮度的色彩空间的好处,如何让颜色同样突出,以及为什么你应该考虑避免纯色。
你几乎可以使用所有这些选项来扩展已有的色彩调色板。大多数工具允许你定义起始颜色(比如冷却色),或者查找特定的HEX码(比如Python色彩调色板查找器或Google艺术工具)。话虽如此,这里有两个专门针对现有调色板寻找更多颜色的小技巧。
虽然我刚才描述的渐变选拔方法并不总是很有希望,但当你有两种颜色并想找第三种时,绝对应该考虑它的变体。如果你只用一步就做渐变,饱和度、明度和色调都会在第一色和第二色之间。
你可以直接用渐变生成器,把步骤设置为3或4,但也有像color-mix.style这样的显式混合工具:

了解你的颜色被别人如何使用,可能会引导你找到与它们搭配得很好的新颜色。你可以在设计工具Behance和Dribble中搜索单一颜色,在Designspiration和TinyEye Multicolr中搜索多种颜色,后者会搜索Flickr图片。
你第一次尝试时选的颜色很可能不会非常适合你的数据可视化。幸运的是,有方法和工具可以让它们更好地工作。
如果你觉得颜色更应该靠近,可以试试混合模式。你可以这样做:
如你所见,颜色之间的色调对比会比以前更小——⬤⬤对比度在应用Blende模式后可能会变弱——所以一定要确认它们是否仍然适用于你的数据可视化。比如这样:
有一些工具可以帮助你改进色彩调色板。以下是我最喜欢的两个:


如果你用 Datawrapper 做图表又不想切换工具,也可以直接用眼看内置的色盲检查。
话虽如此,创建色彩调色板总是耗时的。不只是你!这很正常。
文章翻译自:https://www.datawrapper.de/blog/create-good-color-palettes