你不能错过的超赞色彩组合

最新推荐文章于 2022-03-11 14:44:25 发布

C澒

最新推荐文章于 2022-03-11 14:44:25 发布

阅读量7.7k

点赞数 2

分类专栏： color 文章标签： ui

原文链接：https://www.zcool.com.cn/article/ZMTE5OTEyMA==.html

版权

color 专栏收录该内容

2 篇文章

订阅专栏

知道如何准确地组合颜色是设计师需要掌握的一项关键技能。那么有哪些比较好的色彩组合呢？本文将会给你带来一些灵感和启发。
在这里插入图片描述

1. 了解色彩组合的基础

就科学而言，为了建立和谐的色彩搭配，您应该了解一些颜色的相互作用。创建良好的色彩搭配取决于是否掌握色彩轮盘并了解色彩。
三原色：红色，黄色和蓝色
二次色：绿色，橙色和紫色（当将三原色中的任何两个融合时出现）
三次色：蓝绿色，红紫色（混合主色和二次色时会出现）
在这里插入图片描述

颜色也有温度的，如果您在色彩轮盘的正中心画一条线，则会把色度分成冷暖两类。
暖色：红色，橙色和黄色。它们是明亮，充满活力和活跃的。
冷色：蓝色，绿色和紫色。它们是平静，和平与安详的。

在组合颜色时，根据颜色在色环上的位置可以分出五种关系：
互补色：两种颜色分别位于色彩转盘的相对侧，它创造了高对比度和影响力。
同类色：一种基本颜色的三种临近色。这些组合非常和谐，易于使用，并且可以在设计中实现。
近似色：色环上并排放置三种颜色。通常是选择一种主要颜色，然后使用其他颜色作为搭配色。
三原色：色环上均匀分布的三种颜色。它创造了惊人的充满活力的高对比度效果。
四阶色：四种颜色均匀分布在色彩轮盘上。这些组合非常大胆，因此最好选择一种主要颜色，其余颜色作为搭配。

在以下内容中，您将在实践中看到这些的所有示例，您可以参考这些示例，找到自己喜欢的颜色搭配。

2.两色组合（由两种颜色组合的比较好的示例）

在尝试组合更多颜色之前，让我们从简单但非常有效的两色开始。在第一个示例中，您将看到John William提供的INOVA教育中心的视觉标识，作者将经典的蓝色和黄色组合融入了创新和专业的外观。
墨蓝色 + 金黄色
#38629A — #F8BF28
在这里插入图片描述

下一个例子由Marcelle Teixeira 展示了一个街头艺术风格的设计，在洋红和嫩绿之间赋予了它们有趣的关系。两种颜色在浅灰色的背景上形成了强烈的对比。
洋红 + 嫩绿
#DF3794 — #B0D236
在这里插入图片描述

薰衣草紫 + 日暮黄
#9D84BD — #F5AF60
在这里插入图片描述

下面是由俄罗斯创意机构Golden Mille Group制作的徽标，将象牙与海军蓝相结合。
雾灰色 + 海军蓝
#CAC2B1 — #11123B
在这里插入图片描述

在这个例子中，作者Martijn keesmat通过石色与红色相结合，很好的展示出了探索财富与地位氛围的元素。
白石色 + 血棕色
#E8E6D4 — #893533
在这里插入图片描述

Yukai Du是一位插画家和动画师，拥有丰富的艺术细胞。这是我们选择的她的作品之一，深蓝色和暖红色之间的出色作用非常适合应用于插图中。
绯红色 + 深蓝色
#F79A8B — #121D44
在这里插入图片描述

接下来是设计师和插画家J. Jonathan H. Viveros的作品。整个项目使用多种色彩组合，但是我们选择柠檬黄和覆盆子红，是因为它呈现出柔和温暖的感觉。
柠檬黄 + 覆盆子红
#E6E55C — #E14061
在这里插入图片描述

下面是由多个西班牙平面设计师为Foco设计的品牌设计。该概念提供了三种不同的颜色组合，其中一种是深粉红色和酱紫色。
深粉红色 + 酱紫色
#D568A2 — #492D77
在这里插入图片描述

酱紫色的另一种经典组合是橙色，例如在此示例中，Hycom由多位波兰平面设计师重新命名。它看起来非常干净和专业，并且具有现代和高科技的感觉。
罂粟黄 + 深紫色
#F7A31C — #604DA0
在这里插入图片描述

说到现代感，色彩改变人的心情的影响力是令人惊奇的。在下一个示例中，我们仍将看一看现代设计，但这一次它更暗，反乌托邦甚至令人沮丧。作者Sotiris Kizilos通过几何形状，暗色调以及深蓝色与深粉红色的高对比度完美地说明了这一点。
深粉色 + 暗蓝色
#CAC2B1 — #F8BF28
在这里插入图片描述

接下来是在产品设计上比较好的色彩搭配的例子。平面设计师Kirsten Collins以美妙的颜色组合展示了Hiki这个品牌适用于任何身体体质的概念。我最喜欢的一种是粉红色和橙色结合的除臭剂。
粉红色 + 橙色
#E5B7D6 — #DD7126
在这里插入图片描述

自由职业者DanielaHernández的以下概念应用于牙科图标，简单的形状加上红色和薄荷色的醒目组合，看上去非常干净且具有极高的对比度。
红色 + 薄荷色
#F0504D — #C4E3C7
在这里插入图片描述

黑色和火龙果紫的搭配非常的吸引眼球，用于促销传单既经典又非常有趣。
黑色 + 火龙果紫
#1E1C1E — #E0136E
在这里插入图片描述

冷蓝色与冷淡黄色的对比赋予了这件艺术品很大的个性。
冷蓝色 + 冷淡黄色
#84D5F7 — #FEF6AD
在这里插入图片描述

为了创造更具吸引力的氛围，Thinking Room的下一个概念将深蓝色和深橘色相结合，通过融合街头音乐家和繁杂道路等元素，创造了一种去街头小贩买食品的感觉。
在这里插入图片描述

接下来是韩国平面设计师为KakaoM’1theK’品牌标识设计的浅绿色和蓝紫色结合的夺人眼球的电动组合。就像K-Pop一样：色彩鲜艳，浮华而又充满吸引力。
浅绿色 + 蓝紫色
#5C59A7 — #D4DF45
在这里插入图片描述

下一个示例来自多位乌克兰作家的天然石材艺术创意设计，红色和海军蓝的组合在白色背景下看起来非常的专业。
海军蓝 + 红色
#191347 — #ED1C24
在这里插入图片描述

来自巴西的作者给Plagiados带来了非常未来主义的感觉，一些霓虹灯黄色和黑色，引起了人们的极大注意。
黑色 + 柠檬黄
#000000 — #FADF00
在这里插入图片描述

以下两种不错的色彩组合来自波兰PG品牌。适用于能量饮料，该包装以绿色和紫色，粉红色和蓝绿色，蓝色和石以及黄色和紫色的调味组合，为产品填充了很多能量。
紫色 + 绿色，粉红色 + 蓝绿色
#BA97C6 — #A8D278，#EDA9BD — #41BEB0
在这里插入图片描述
罐子背面的有趣插图使颜色看起来更加美味。
绿松石蓝 + 姜黄，成熟的柠檬黄 + 时髦的紫色
#61C1E5 — #F0C11F，#F9E300 — #925BA5

在下一个组合中，来自阿根廷funjuan dg的图形设计师，在薄荷背景上的紫红色字母中创造出了令人惊叹的书法设计。
紫红色 + 石蓝色
#DC0C82 — #91CAB6
在这里插入图片描述

Loudhead是一个拥有最好的个人音频制造商和音响鉴赏家。此概念的设计响亮，高对比度立即引起人们的注意。该项目由不同的俄罗斯设计师创建，提供了绿色，粉红色，洋红色和深蓝色与深绿色令人印象深刻的良好色彩组合。
红紫色 + 深蓝色，朱砂 + 深蓝色
#D71965 — #302F81，#DF4B2D — #302F81
在这里插入图片描述

在下一个示例中，创意设计师Mauricio Alves为巴西的一家广告公司和设计工作室创造的经典的紫色和深橙色组合。
深紫 + 朱砂
#684099 — #E94F24
在这里插入图片描述

下面我们看到了Emir Kudic用木炭和橙色制成的出色徽标设计。
石炭色 + 橙色
#182F41 — #F19372
在这里插入图片描述

3.三色组合（三种颜色的良好颜色组合的示例）

在本节中，我们将两种颜色升级，以便获得更丰富的调色灵感。在许多情况下，您会看到一种主导色和两种搭配色。让我们从Jon Stapp的“不要忘记音乐”项目的示例开始。我们选择的设计之一是书本模型，薄荷、海军和充满活力的橙色之间呈现了非常可爱的互动。
薄荷色 + 海军蓝 + 橙色
#96C5BD — #182039 — #DB7049
在这里插入图片描述

艺术总监和3D艺术家拉斐尔·拉米雷斯（Rafael Ramirez）创造了一系列令人赞叹的非洲面具。这些面具中，除了出色的设计外，还具有非常醒目的木炭色，绿色和黄色组合，并带有白色几何点缀设计。
木炭色 + 海洋绿色 + 金色
#3B3B3B — #43A96F — #EAC11D
在这里插入图片描述

另一组则是非常优雅的和谐组合，它们融合了温暖而美味的色彩。这些巧克力设计的作者是开罗艺术总监Mohamed Loutfy。
棕黄色 + 红棕色 + 核桃棕
#C2842B — #BF5B28 — #76431B
在这里插入图片描述

下一个色彩魔术是来自巴西的平面设计师FábioSantana的项目。很自然地，他将这些霓虹绿，深粉红色和蓝色以两个为一对进行所有可能的组合，但它们在三个中一起看起来也很棒。
霓虹绿 + 深粉红色 + 蓝色
#CADB2A — #D5899D — #363192
在这里插入图片描述

为延续经典，万圣节设计以木炭，浅灰色和鲜亮橙色捕捉完美的假日气氛，形成鲜明对比。该组合在蓝色背景上看起来也很整洁。
鲜亮橙色 + 浅灰色 + 木炭
#F15B22 — #F4F4F4 — #30302F
在这里插入图片描述

粉色 + 石榴橙 + 城堡绿
#ED8DBA — #F05023 — #47B861
在这里插入图片描述

以下设计是一些糖果色调色板。从彼得·塔卡（Peter Tarka）的3D插图开始，我们享受着玫瑰粉，石黄和苔绿色的温暖。
玫瑰粉 + 石黄 + 苔绿色
#CF8599 — #DDB271 — #94AFAA
在这里插入图片描述

ÁlvaroStudio的Poptypes项目的另一种设计使用了该组合的更具气泡气息的版本，显示了淡蓝色，淡粉红色和艳黄色。满满的甜品味道～～～
淡蓝色 + 淡粉红色 + 艳黄色
#A8DDE0 — #F7B7CD — #F5EB17
在这里插入图片描述

排在第二位的是Baianat的品牌设计，该产品在特殊场合出售独特而时尚的商品。
深红色 + 玫瑰花蕾 + 稻草黄
#E56FAB — #F8AC8A — #E9EC87
在这里插入图片描述

这是Rodrigo Batista为Mover Criativo设计的经典作品，黄色和两种对比鲜明的蓝色看起来很专业而且很吸引人。
姜黄 + 蓝紫色 + 天蓝色
#EBC655 — #5D509F — #71C7EA
在这里插入图片描述

火烈鸟红 + 墨绿 + 草绿
#E75724 — #172A1B — #376444
在这里插入图片描述

4.四色组合（四种颜色的良好颜色组合的示例）

让我们加入另外一种颜色扩展三种颜色组合，以获得更丰富的调色板。这些调色板通常具有一个主要的或真正高对比度的深色，而其他三个则是搭配色。
在朱莉亚·阿科西（JúliaAccorsi）的第一个例子中，我们从她的插图中看到了这一点。调色板由三种温暖舒适的颜色以及一种高对比度的深色组成。
黑色 + 橙红 + 粉红 + 深腮红
#2E2B14 — #DE5B26 — #F4D1C4 — #E562A4
在这里插入图片描述

他使用的另一种经典调色板是将深蓝色与红色，蓝绿色和象牙色相结合，用于个人项目。
黑色 + 红色 + 蓝绿色 + 象牙色
#2A131F — #DF4B52 — #78A4A7 — #FBEADB
在这里插入图片描述

深蓝色 + 天蓝色 + 浅紫 + 太阳黄
#10103C — #6ACDEE — #C071AE — #F6B319
在这里插入图片描述

紫色 + 玫瑰红 + 草绿 + 金色
#654C90 — #D04E59 — #3AB8A9 — #E3AD24
在这里插入图片描述

5.渐变色（渐变颜色组合的示例）

通常，经典渐变仅使用两种颜色混合并具有优美的过渡效果，但有时，设计师更喜欢对混合进行更多控制，并在中间添加更多色彩。
在以下示例中，您将看到Pedro Assis为Institucional BDMG 2020日历设计的经典两色渐变。
钢蓝 + 螳螂绿
#4E7BBE — #73C164
在这里插入图片描述

石榴 + 胡萝卜橙
#EF3D33 — #F39220
在这里插入图片描述

作者Garagephic Studio使用了紫色和蓝色两种不同的颜色，以便为ButterChat徽标创建具有更鲜明活力的渐变。接下来是另一个徽标，这次是Vect +为Nunito设计的更温暖，更生动的火龙果和珊瑚组合。
桑紫色 + 深紫 + 暗蓝色 + 天蓝色
#C8468B — #742671 — #3F3D8C — #57B7E7
在这里插入图片描述

洋红色 + 康乃馨橙
#ED1260 — #F15A51
在这里插入图片描述

6.蓝色组合示例

蓝色可能是梦幻，刺眼，强烈甚至令人沮丧的，与其他互补色的进行良好的色彩组合，甚至可以讲出生动的故事。
在第一个示例中，天蓝色非常梦幻、热情，与珊瑚和桃色互动。它给人现代时尚的感觉，该组合是Ghulam Rasool的时尚应用程序中页面设计的选择。
天蓝色 + 珊瑚红 + 桃粉
#6EC9DB — #F18375 — #F5C9BD
在这里插入图片描述

laaziz的《两面猫》展示了清澈梦境中的暮色气氛，这与画面使用了更鲜艳的蓝色与霓虹的粉红色有关。
宇宙蓝 + 梦幻粉
#2C2A74 — #F39EC4
在这里插入图片描述

在拉娜·马兰迪纳（Lana Marandina）的另一幅插图中，蓝色仍然给人以夜空的感觉，但是这次是不同的是用不太鲜艳的色调。蓝色与黄色的结合传达出宁静与孤独，看起来诱人而舒适。
蓝色 + 天蓝色 + 钢蓝色 + 金色
#111D42 — #3566A4 — #588BBA — #F0CF33
在这里插入图片描述

最后两个示例在黑暗主题方面更进一步。MichałMleczak创作的《自然之色》通过蓝色和珊瑚的两种渐变激发了深海的感觉，非常生动。
蓝色 + 橙色
#4B5EAA — #1C2A58，#BF5927 — #F39A1F
在这里插入图片描述

还有Sushama Patel的这张惊人的插图。该舞者的颜色是由蓝绿色，木炭色，洋红色和浅灰色的高对比度颜色组合而成，看起来让人印象深刻而且很有艺术气息。
蓝绿色 + 木炭色 + 洋红色 + 浅灰色
#62C7CB — #262A34 — #EE2E62 — #EAEAEA
在这里插入图片描述

7.红色组合示例

红色本身就是一种很强烈的颜色，但是在调色板中的正确使用却可以显得沉稳柔和。
在下图由Rokas Aleliunas制作的Flowers Swims中，在深绿色的衬托下，深红色看起来梦幻而沉稳。
红色 + 深蓝 + 墨蓝
#8D1920 — #1D2524 — #2D626C
在这里插入图片描述

下面是一个绘画应用程序。Mohamad Chalak的设计展示了红色，橙色，蓝色和蓝绿色之间充满活力的互动，展现了可爱的鹦鹉角色及其周围环境。背景中更深的蓝绿色产生深深的丛林氛围。
红色 + 橙色 + 蓝色 + 蓝绿色
#E92425 — #F4BC18 — #45AEE3 — #206158
在这里插入图片描述

马拉特·瓦希托夫（Marat Vahitov）和他的插图展示了另一个经典的红色组合，搭配有蓝色和黑色。它绝对给人一种商务氛围。
朱砂 + 钢蓝 + 鳕鱼灰
#EF3E3B — #4776BB — #161616
在这里插入图片描述

接下来是Ivan Puzyrev的插图，红色和绿色的亮度都很高，而石黄和棕色则使画面平静了一些。此组合确实具有神奇而令人兴奋的感觉。
红色 + 绿色 + 棕色 + 石黄
#C82327 — #9FCE61 — #6D2712 — #F9F290
在这里插入图片描述

8.绿色组合示例

绿色是下一个需要研究的颜色。在心理学方面，绿色被认为具有镇定和放松的作用。在市场营销方面，由于它让人产生对大自然的联想，因此对于生物和生态产品来说是更可取的。通过将绿色与其他颜色组合可以传达的心情是无限的。
因此，让我们从露西·巴加特开始。抽象的形状看起来很有力，并且以深绿色，蓝色，粉红色和橙色的颜色组合形成鲜明对比。
深绿色 + 蓝色 + 粉红色 + 橙色
#1F3A1D — #74BBD4 — #F1959A — #E16025
在这里插入图片描述

绿色的其他两个示例在氛围方面完全不同。在这里，我们介绍的是Veggie Shop应用程序设计，其中包含绿色，阳光明媚的黄色和鲜亮的橙色的新鲜可爱色调。
浅绿色 + 深绿色 + 黄色 + 橙色
#73BF44 — #4B904A — #FBE251 — #F0783A
在这里插入图片描述

另一个是彼得·塔尔卡（Peter Tarka）撰写的《苹果的惊喜六日》（Apple-Six Days Surprise），蓝绿色与海军蓝和紫色相结合呈现其高科技和专业的感觉。
蓝绿色 + 海军蓝 + 薰衣草紫
#37AB8F — #323D59 — #6D2712 — #9586BF
在这里插入图片描述

9.黄色的组合示例

在第一个示例中，同样由Peter Tarka创作，您将看到黄色，蓝绿色，玫瑰尘和蓝色的一些可爱的几何图形，非常适合现代UI页面设计。
黄色 + 蓝绿色 + 玫瑰尘 + 蓝色
#ECCB7D — #59B4B6 — #ECADCE — #8DC6EC
在这里插入图片描述

第二个示例是Outcrowd的登录页，该页面使用了几何图形，具有黄昏的沙漠感，并使用深黄色，红色，紫色和非常深的紫色进行对比。
深黄色 + 红色 + 紫色 + 非常深的紫色
#F8BF73 — #E2502D — #705568 — #2C2439
在这里插入图片描述

在最后的两个示例中，贾斯汀·维纳隆（Justin Vinalon）以抽象的图案将阳光明媚的黄色与橙色，粉红色和浅黄色完美地结合在一起。
黄色 + 橙色 + 粉色 + 黄白色
#F7C314 — #F26A21 — #F48EA8 — #FEF5D1
在这里插入图片描述

奶油黄 + 紫红色 + 栗玫瑰色
#F3CD62 — #BB5DA4 — #CF5E79
在这里插入图片描述

10.橙色组合示例

来自Creative Mints的Mike提出的第一个网络设计概念示例，我们看到橙色与酱红，黄色，灰色的相互作用非常好。
橙色 + 酱红 + 黄色 + 灰色
#EB6D50 — #8A181A — #FBD75F — #646F7D
在这里插入图片描述

在第二个示例中，GyöngyiBalogh的插图中，较粉红色的橙色与粉红色，蓝色和金色形成对比。
粉红色 + 浅蓝色 + 浅粉色 + 金黄
#F0867F — #80B3E0 — #FCD5D4 — #F8BB23
在这里插入图片描述

橙色也可以产生复古感。在这个由Andrey制作的90年代风格的网站中，它与较浅的橙色和黑色之间的交互作用很好，可用于Web设计。
橙色 + 浅橙色 + 黑色
#E7784C — #F8B454 — #000000
在这里插入图片描述

为了吸引更多的注意力和强烈的效果，鲜亮的橙色和蓝色搭配不会被人们忽略。在Benoit Drigny的这张极简主义插图中呈现的能量真的很强大。
橙色 + 浅蓝色 + 深蓝色
#F26522 — #6982C0 — #3A2A7A
在这里插入图片描述

当然，可以通过使用灰色来减轻橙色的强烈感，如在另一个示例中的tubik.arts（名为Orange Vibes）所看到的。
橙色 + 棕色 + 灰色
#F27E21 — #514648 — #908582
在这里插入图片描述

11.紫罗兰色组合示例

我们从平面设计师Broklin Onjei的Slickfish徽标和标识设计开始。这里的紫色较暗，并与白色，火龙果和天蓝色相结合。所产生的对比令人惊叹，看起来非常现代。
暗紫 + 白色 + 洋红 + 天蓝
#512E90 — #FFFFFF — #E61D69 — #4CC6DE
在这里插入图片描述