暖色调配色方案:8 套蓝橙与香料色品牌配色

暖色最容易讨人喜欢,却最难用语言形容。橙色、红椒色和咖喱色彼此靠得很近,所以它们会发光,也因此很难在彼此身上读出字来。这里有八套暖色调配色,附全部十六进制色值,还有每套里负责“读字”的那个颜色。

为什么暖色需要搭档

暖色配色有两个问题。暖色在色轮上彼此相邻,并排放在一起会发光,却承载不了文字,比如 Paprika Kisses #C24325 和 English Walnut #3E2B23。而当你跨过色轮去找对比时,新来的颜色又可能和第一个颜色打架。

下面的八套配色用两种方式解决。前四套用蓝色作为橙色的对立色,中间夹一个安静的第三色。后四套留在暖色家族内部,引入一个能读出字的深色。

每套配色下的第四个色块展示标志会用到的搭配,只用该配色本身的颜色,不加白也不加黑。这些对立色是怎么选出来的,请看我们关于色彩和谐的文章。

蓝与橙,四种玩法

蓝加橙是品牌设计里最老的招数,也是最容易用砸的一招。它们在色轮上互为对立,放在一起会嗞嗞作响。

问题出在明度。Azraq Blue 和 Mahogany 明度相同,所以只要它们相接,边缘就会抖动。放在图案里没问题,放在背景上的标志里就很难受。

四套的解法都是第三色。Vacherin Cheese、Apricot Sherbet、Silverton 和 Broad Daylight 给这对吵闹的组合提供了一个安静的落脚处。

Saturated Sky

#5248F8

Saturated Sky

#FFAC3E

Mandarin Sorbet

#FFD3A4

Apricot Sherbet

Saturated Sky

Apricot Sherbet on Saturated Sky

最亮的蓝,配柔和的橙和淡杏色。Apricot Sherbet 是它们之间的落脚处。

Mahogany

#4969B3

Azraq Blue

#BA3901

Mahogany

#FFEB88

Vacherin Cheese

Mahogany

Vacherin Cheese on Mahogany

会抖动的一对。Azraq Blue 和 Mahogany 保持距离,Vacherin Cheese 是稳住它们的安静第三色。

Raw Sunset

#0C3842

Sunken Harbour

#FF6634

Raw Sunset

#C1DBD0

Silverton

Raw Sunset

Raw Sunset on Sunken Harbour

这里的蓝走向深沉。Sunken Harbour 足够深,可以承载大号橙色字体,Silverton 则提供平静的浅色底。

Cinnamon

#996513

Cinnamon Brown

#FDEB7D

Lemon Peel

#C2E2FF

Broad Daylight

Cinnamon

Lemon Peel on Cinnamon Brown

四套里最温和的一套。Cinnamon Brown 是这里最深的颜色,但也不算很深,所以这套适合大标志和大标题,Broad Daylight 是冷调的浅色。

香料色,以及能读出字的深色

香料色看起来温暖,是因为它们彼此靠得很近。这也是在上面放字时它们会打架的原因。Paprika Kisses 和 English Walnut 都是红棕色。并排放着会发光。

互相当文字用时很难读,所以红椒色永远不要在核桃色上写字。Chai Latte 才是能做到的颜色:核桃色放在 chai 上很好读。

Curry 和 Sesame Seed 靠得更近。Black Turmeric 是能同时托住它们的颜色:在 sesame 上很好读,在 curry 上也刚好够用。

Sun Dried Tomato

#752329

Sun Dried Tomato

#918C7E

Laurel Oak

#F1E8DF

Gardenia

Sun Dried Tomato

Gardenia on Sun Dried Tomato

Sun Dried Tomato 放在 Gardenia 上很好读。Laurel Oak 是安静的中间色,做图案很可爱,但绝不能用来写小字。

Golden Sandalwood

#EBD3BB

Almond Light

#847862

Golden Sandalwood

#27271F

Green Velvet

Golden Sandalwood

Green Velvet on Almond Light

Green Velvet 放在 Almond Light 上很好读。Golden Sandalwood 是这里安静的中间色,用在图案或大色块上。

Paprika Kisses

#C24325

Paprika Kisses

#F9CBA0

Chai Latte

#3E2B23

English Walnut

Paprika Kisses

English Walnut on Chai Latte

Paprika Kisses 和 English Walnut 放在一起会发光,但文字要用 English Walnut 放在 Chai Latte 上。

Curry

#D6A332

Curry

#E1D9B8

Sesame Seed

#2C4364

Black Turmeric

Curry

Black Turmeric on Sesame Seed

Curry 和 Sesame Seed 几乎是同一种颜色。Black Turmeric 是能同时托住它们的深色,在 sesame 上很容易读。

最后两套配色里的每个颜色,都是开源颜色名称列表里的真名:Paprika Kisses、Chai Latte、English Walnut、Curry、Sesame Seed 和 Black Turmeric。

八套配色一览表

如何为你的品牌使用暖色配色

1. 先选读字的颜色。 在挑选发光的颜色之前,先决定由哪个颜色承载文字,比如 Black Turmeric #2C4364 或 Sunken Harbour #0C3842。
2. 让吵闹的一对保持距离。 橙色紧挨着明度相同的蓝色会抖动。把安静的第三色放在它们之间。
3. 把相近的暖色当作质感。 两个近邻能做出好看的图案或条纹,却是糟糕的文字搭配。我们的品牌色彩方案文章讲了完整体系,大胆配色方案则收录了同一思路的高调版本。
4. 用单色测试标志。 如果它只有橙色才好看,放到印章或深色照片上就会失败。

获取每个家族的文件

每个家族都是 Forge 上的免费色彩集,附点击复制的色值、适用于 Figma 和 Adobe 的色板文件(ASE)、CSS 变量和设计令牌。

免费色彩集

蓝与橙,四种玩法:Saturated Sky、Mahogany、Raw Sunset、Cinnamon

全部十六进制色值,外加 ASE 色板、CSS 变量和设计令牌。

打开色彩集

免费色彩集

香料色,以及能读出字的深色:Sun Dried Tomato、Golden Sandalwood、Paprika Kisses、Curry

全部十六进制色值,外加 ASE 色板、CSS 变量和设计令牌。

打开色彩集

FAQ

什么是暖色调配色方案?

暖色调配色方案由色轮上偏橙、红、黄一侧的颜色构成,比如 Paprika Kisses #C24325、Chai Latte #F9CBA0 和 Curry #D6A332。对品牌来说,配上一个负责承载文字的深色效果最好。

什么颜色和橙色搭?

蓝色是经典搭档,因为它在色轮上与橙色相对。Raw Sunset #FF6634 配深蓝 Sunken Harbour #0C3842 是很强的一对。再加一个安静的第三色,比如 Silverton #C1DBD0,让两者有个平静的落脚处。

什么是好的蓝橙配色方案?

Saturated Sky #5248F8 搭配 Mandarin Sorbet #FFAC3E 和 Apricot Sherbet #FFD3A4 是最亮的选择。Raw Sunset #FF6634 放在 Sunken Harbour #0C3842 上是深沉的那套,而 Mahogany #BA3901 配 Azraq Blue #4969B3 适合用作图案,因为这两者明度相同。

品牌配色里的香料色是什么?

香料色是以外观命名的大地色调,比如 Paprika Kisses #C24325、Curry #D6A332 和 Black Turmeric #2C4364。当其中一个颜色深到足以承载文字时,它们就能成为一套配色。

为什么文字在暖色上很难读?

色轮上的邻居,明度也可能很接近。Paprika Kisses 和 English Walnut 都是红棕色,所以把一个的字放在另一个上很难读。English Walnut #3E2B23 放在 Chai Latte #F9CBA0 上则很好读。

这些配色方案可以免费使用吗?

可以。这些十六进制色值可免费用于任何项目,每个家族都能在 Forge 免费下载,含色板文件和 CSS。

来源

• 颜色名称和十六进制色值来自我们团队色彩看板上的配色卡片,并与已发布的 Forge 色彩集核对过。Paprika Kisses、Chai Latte、English Walnut、Curry、Sesame Seed 和 Black Turmeric 是开源 color-name-list 里的名称。
• 每组搭配的可读性均用 WCAG 2 对比度公式检查。Azraq Blue 和 Mahogany 明度相同,所以边缘会抖动。Sunken Harbour 可承载大号橙色字体。Cinnamon 是蓝橙系列里最柔和的一套,适合大标志。在香料色系列里,English Walnut 放在 Chai Latte 上、Black Turmeric 放在 Sesame Seed 上都很好读,而 Laurel Oak 和 Golden Sandalwood 是适合图案的安静中间色。
• 最初以两组轮播图发布于 Logo Brainy:蓝与橙,四种玩法和香料色,以及能读出字的深色。