Date 2025-11-03 11:39:47

众所周知,我们日常设计中的五个元素是“形、色、字、构、质”,这五个部分的内容紧密相连,形成了整个产品的设计体系。其中,色彩是我们设计中特别重要的内容,是除了形状和字体之外最能表达差评氛围的元素。
良好的色彩设计,我们通常可以通过品牌色彩感受到品牌产品的状态、情感、情感和精神内容。
色彩仍然是一个特别容易区分品牌或行业的因素,所以我们可以看到不同品牌在市场上有不同的颜色匹配,如部分商业和技术公司将使用冷色调(如腾讯,Facebook),餐饮公司喜欢使用暖色(如美团、公众评论、麦当劳),健康行业的公司喜欢使用绿色部门(如中药、泰康人寿),这是因为人们对颜色系统有先入为主的认知。当然,这并不完全是唯一的恒定,比如餐饮行业,他们做健康餐,很可能把品牌颜色设置为绿色部门。
此外,人们的年龄、兴趣、性别和习惯可能会对同一种颜色有不同的感觉。这就是为什么有些人喜欢蓝色,有些人喜欢绿色,有些人喜欢黄色。因此,许多大型工厂在产品开始时会调查目标用户的颜色趋势
然而,好的颜色往往不是随意的,而是设计师通过心理研究、用户研究等方式最终确定的,这就要求我们有一个相对完善的设计体系理论。
今天,我想和大家谈谈颜色系统。在制作新产品的颜色系统时,我们经常需要解决一个问题,即颜色梯度,即色卡制作。
阅读文章 >当大多数设计师第一次进入这个行业时,设计纯粹依赖于他们自然的颜色感觉,但不一定每个人的颜色感觉都是先进的,所以我们需要学习一些基本的颜色内容,了解不同颜色逻辑之间的关系,这更有助于我们做颜色设计

人类看到的颜色是由光产生的反射感觉到的,不同波长的光射线产生不同的颜色,包括单色和混合颜色。如果光足够纯净,我们看到的颜色是单色的。但实际上,人类看到的光普射线波长是混合的,这就是为什么我们除了彩虹的单色外,还可以看到其他混合的颜色。

*图片来自网络
当光的反射弥散值超过一定值时,我们看到的是白色。相反,如果一个物体不能反射光,我们可能会看到这个物体是黑色的。

1. 三原色是什么?
三原色的划分有两种逻辑,即艺术三原色:红(品红)黄蓝(青);光学三原色红绿蓝

2. 色相、饱和度、明度是什么?
色调、饱和度和亮度的结合已成为色彩的三个要素。在设计时,我们基本上需要考虑这三个维度的组合来设置我们的颜色值。

色相:指颜色本身,如红色、蓝色、绿色,如下图中的色组
饱和度:又称纯度,饱和度是混灰多少的问题。混灰越多,饱和度越低。如果不混,越高。
亮度:也被称为亮度,亮度类似于饱和度,但亮度是混合白色或黑色的逻辑,以标准颜色作为最高亮度的标准,混合黑色越低,混合白色越浅,属于双向逻辑。
3. 什么是色值
在rgb模式下,由16进制转换而成的颜色值(Hex)通常通过专业的设计软件或一些在线转换的小工具来实现。

4. 什么是色彩模式?
色彩模式是我们经常在软件中选择的具体模式,通常包括Hex、RGB、CMYK、HSB。在使用过程中也存在差异。以下是每种模式的项系数描述:

*图片来自网络
Hex(Hexadecimal):在设计和颜色表达中,通常指的是16进制的颜色值,也称为 Hex Code。Hex Code 用于表达的是一种 RGB颜色的深度和纯度通过六个十六进制数字来描述。

RGB(Red、Green、Blue):RGB更容易理解,一般与CMYK相对应,RGB 它是最常用的颜色模型之一,广泛应用于数字图像、计算机显示器、摄影和许多其他领域。
sRGB(标准红绿蓝)是显示器、相机和互联网图像的标准 RGB 颜色空间。它是一种广泛使用的颜色标准,旨在保证不同设备和平台上显示的颜色的一致性。

CMYK(Cyan、Magenta、Yellow、Black):CMYK 它的名字代表蓝色是一种颜色模型(Cyan)、品红色(Magenta)、黄色(Yellow)、黑色(Key/Keyline)这四种颜色。CMYK 广泛应用于印刷行业,尤其是在创建彩色印刷品时,如杂志、海报、包装等。
在 CMYK 在模型中,每个颜色通道的值通常以百分比表示,表示每个颜色的浓度。由于该颜色模型通过混合颜色创建其他颜色,因此使用 CMYK 它可以模拟广泛的颜色。添加黑色通道是因为在实际印刷中使用纯色 CMY 黑色通道可以增强深度和对比度,而不能完全产生深度和真实感。
HSB/HSV(色调、饱和度、亮度):它是一种颜色模型,它以人类感知颜色的方式表示颜色。HSB 该模型通常用于图形设计、图像处理和其他创意领域,因为它更直观地反映了颜色的特征。HSL和HSB属于同一模式,唯一的区别是轴的差异

5. 什么是色系
色彩系统,可以理解为色彩系列,属于色调的扩展说法,色彩系统往往以一整组的方式设计或出现在每个人面前。
我们常说的颜色系统有暖色系和冷色系,这是根据人类对颜色感知的温度来划分的, 在色环中,绿色和紫色是边界,红色、橙色和黄色是暖色,绿色、蓝绿色和蓝色是冷色。

但在实际应用中,设计师会根据自己的设计内容定义一些颜色名称,如蓝色(冷色),设计师一般意味着海洋色;绿色,设计师将定义为森林色;另一个例子是粉红色,通常是芭比粉,这些命名是营销人员为了让用户更具体和直观的认知,在颜色中,没有这些说法。



*图片来自网络
6. 什么是色环
色环,又称色轮和色圈,是环形显示可见光区域颜色的常用工具。最基本的色环将包含12种不同的颜色。但在实际设计中,设计师将根据实际颜色应用将其扩展到24色环或36色环。

7. 互补色是什么?
简单来说,两组颜色混合后产生的非颜色(中性灰色)颜色是互补色,互补色包含在对比色中。
从色环的逻辑来看,180°直线对面的两组颜色是互补色,但由于不同颜色系统的组成不同,我们在CMYK(减色)和RGB(叠加色)下会产生不同的对比色逻辑,大致如下:

互补色分为叠加补色和减色。这很容易理解。我们可以直接理解,叠加是RGB模式,减少是CMYK。在RGB中,如果两种颜色的RGB值加起来是255,那么它们就是互补色。
8. 对比色是什么?
跨度为120,在色环中°-179°颜色可以称为对比色 。

9. 中差色是什么?
中差色介于相邻颜色和对比色之间,在色环上相互90°中差色组对比度明确。当基准色和相邻色之间没有足够的区别时,可以考虑使用中差色进行设计,以增强色感的清晰度。

10. 什么是邻近色?
相邻颜色是颜色环中相邻的颜色,一般颜色环为60°左右两种颜色可定义为相邻颜色,如蓝色和绿色、黄色和橙色。

11. 类似的颜色是什么?
类似的颜色接近相邻的颜色,但相似的颜色的范围小于相邻的颜色。一般来说,颜色环的30度左右的两种颜色可以定义为相似的颜色,如橙色和黄色、蓝绿色和蓝色。

12. 什么是撞色
对比色是设计表达的命名方式,一般指红绿、红蓝两种冲突色。基于这个概念,很容易理解,也就是说,我们常说的对比色或互补色可以定义为对比色逻辑。

13. 混合色是什么?
混合色是基于三原色的原则提出的颜色概念,即由两种或两种混合而成的第三种颜色。例如,红色+黄色会变成橙色,黄色+蓝色会变成绿色。在设计中,混合色通常用于过渡性配色。
色彩情绪是指人们在看到颜色时产生的情感或情感冲动。这种情绪是由不同频率的颜色产生的光信息通过眼睛传递到大脑后产生的联想思维结果,是从外部到内部,从生理到心理转变联想的结果。
理论上,同一地区的不同人对同一颜色的情绪会有微妙的差异,但总体上是一致的。差异在于情绪的程度。色彩情绪会受到我们从小到大的环境的影响,导致不同的人对同一种颜色有很大的认知差异。比如常年生活在树木多的地方,自然会更喜欢绿色,而在海边长大的孩子会更喜欢蓝色。这是因为长期的环境影响。
不同的颜色代表不同的情绪反馈

1. 红色
红色是血液的颜色,给人一种热的感觉,让人情绪高涨,变得兴奋。红色是所有光谱中最低频率和膨胀的。在设计中,不要大面积使用红色,除非你有经验使用颜色,否则很容易引起视觉疲劳。

*图片来自网络
2. 黄色
太阳的颜色给人一种温暖、灿烂、灿烂的情感感受。如果在设计中使用黄色,则表明该品牌具有较高的信心,是一家正能量企业。但黄色不应与白色重叠,容易导致轮廓不清晰,影响内容的识别。黄色作为金色的辅助颜色,在设计和使用中也更加通用。

*图片来自网络
3. 蓝色
天空和大海的颜色是蓝色,蓝色是冷色,给人一种平静向内的情感感受。同时,蓝色也是科技和商业的一种颜色。大多数商业品牌喜欢以蓝色为主色调,如腾讯、脸书等大型工厂。

*图片来自网络
4. 绿色
大自然的颜色,绿色给人一种清新舒适的感觉。属于中性色,既没有明亮的黄色,也没有深邃的蓝色,给人一种安全感的情感价值。市场上大多数健康品牌都会选择绿色作为主色调。然而,正是因为绿色是一种中性色,所以我们需要在设计中更好地处理它,以便设计出先进的个人感觉。

*图片来自网络
5. 橙色
橙色和黄色属于太阳的颜色,但比黄色弱一点。橙色是由黄色和红色混合而成的颜色,所以橙色的应用需要选择一些黄色,这会给人一种自然的舒适感。如果橙色太深,就会有“焦”的感觉,让设计看起来不那么年轻。

*图片来自网络
6. 紫色
紫色有一定的“魅力”感,是一种比蓝色更深的颜色,给人一种邪恶、深沉、迷人的感觉。因此,在设计中,为了使紫色更好地表达,你可以考虑添加一些白色来提亮,让紫色粉末,以减少紫色本身的气质。

*图片来自网络
7. 金色
黄金的颜色给人一种高贵、奢华、高贵的感觉。无论是线上还是线下,所有VIP的设计基本都以金色为主色调,金色搭配白色、银色、黑色、紫色...它可以反映出一种先进的感觉,所以它也被称为最通用的颜色。但要在设计中使用金色,你需要控制金属呈现的比例,有点粗心会变得“土壤”。

*图片来自网络
8. 黑白色
黑白,阴阳,黑白在大多数情况下是辅助颜色,如在品牌设计中,只有文本颜色属于黑白,但简单使用黑白也可以设计非常先进,如国际一线时尚品牌off-white,就是把黑白发挥到极致,以至于很多品牌都争相模仿。黑白作为品牌色最大的优势就是不容易过时,因为黑白是身边不可避免的色调。

*图片来自网络
不同的颜色会产生不同的心理效果。每个人在细节上都有不同的感受,但总的来说,即使是来自不同文化的人也经常有相同的感受。例如,红色使人兴奋,蓝色使人安静。色彩的心理作用对艺术家、建筑师、服装设计师和广告商都非常重要。
此外,人们对颜色的感觉也有许多特殊的影响。一个有趣的现象是,如果一个画家在绘画时只使用几种颜色,我们的眼睛会试图把灰色或其他中立的颜色看作是缺乏的颜色。如果一幅画只有红、黄、黑、白,那么我们就会把黄、黑的混合色看作是绿色,红、黑的混合色看作是紫色,灰色看起来有点蓝。
虽然不同的颜色产生不同的情感感受,但如果我们在设计时只使用单一的颜色,它就会显得太单调。即使在自然世界中,也不会有完全单色的物体。
因此,我们仍然需要通过不同颜色的组合来设计,通过组合的颜色来传达新的视觉感觉,有些协调,有些自然,有些新鲜,有些冲突,有些先进。
让我们通过几组颜色来看看不同的颜色搭配感觉:
① 整个颜色属于中饱和度,蓝色和黄色本身就是一组高度匹配的颜色,一冷一暖,整体冲突又协调。


*图片来自网络
② 这组颜色属于深色调,无论是深深的深蓝色背景还是深红色都给人一种神秘感,但红蓝色的对比冲突有一些协调。


*图片来自网络
3. 这组颜色,主体整体偏粉,处于低饱和状态,给人温柔、舒适、柔软的感觉。


*图片来自网络
4. 这组颜色主要由紫色和黄色组成,对比强烈,给人一种神秘但生动的感觉


*图片来自网络
5. 这组水果的配色饱和度高,整体感觉是“新鲜”


*图片来自网络
色彩设计在图形设计中也非常重要。在实际的产品设计中,图形的属性、表达和内容的归属需要通过不同的颜色来设置。图标颜色的应用可以涵盖许多不同的领域,包括设计和用户界面(UI)、品牌标识等。
一般来说,图形中的颜色应用需要根据设计目的、受众、信息水平等因素仔细选择。适当的颜色使用有助于提高图形设计的效果,使其更具吸引力和表达力。
1. 保证品牌色调的严谨性
公司和品牌通常使用特定的颜色来识别和区分自己,所以在任何场景下都要确保品牌色调的准确性,以加强品牌的可识别性和一致性。

2. 品牌主题设计
例如星巴克的设计一直以品牌绿为主色调,从logo开始,贯穿于整个产品内容、宣传内容、APP、整个网站都是品牌主题设计。久而久之,用户看到绿色就会想到星巴克的品牌。

*图片来自网络
3. 图形颜色的一致性
在图标设计中,保持颜色的一致性是图标设计的意向基础。整个产品的协调感和品牌的统一色调可以通过与纹理、形状等内容相匹配来提高。

*图片来自网络
4. UI中的应用
通过品牌色调的点缀,提升品牌的设计色调,利用留白、对比、强调,让用户记住色调。

*图片来自网络
5. 虚拟界面可视化
在可视化界面设计中,由于真实环境或虚拟环境本身有一定的干扰,因此在设计中需要使颜色更加生动,内容设计本身需要直接、干净、简洁。

*图片来自网络
品牌色彩结构是指品牌在设计和视觉表达中使用的特定色彩组合。这种色彩结构有助于在各种媒体和平台上建立品牌的视觉识别和一致性。
品牌色彩结构的建立需要仔细考虑品牌战略和设计过程,以确保品牌能够在不同的情况下传达一致的形象和价值观。一旦建立,品牌色彩结构将成为品牌标识的核心要素之一
品牌色彩结构主要包括:主色、辅助色、中性色、强调色、互补色、色彩规范、相应色

*来自google的案例来源 search 品牌
1. 主色
颜色主要用于品牌的核心,通常与整体品牌色调密切相关,在整体色彩结构中所占比例最大。大多数用户从品牌的主色调中感受到品牌的整体色调。例如,星巴克的黑色和绿色给人一种宁静,麦当劳的红色和黄色给人一种活跃的兴奋,Facebook的蓝色给人一种商业平静。
2. 辅助色
辅助色可以是与主色相匹配的颜色,也可以是对比色设计,用来弥补单一色彩设计的问题。它属于品牌设计中的第二种颜色。此外,辅助色可用于背景、文本、按钮和其他元素,以提供更多的设计灵活性。
3. 中性色
中性色通常使用黑色、白色、灰色,或深度较高的深色。中性色的主要作用是填补色彩应用的不足,出现在一些不能使用品牌色或辅助色的场景中。例如,我们的字体颜色可以使用中性色进行大面积的设计,平衡整体颜色,使文本设计的可读性更高。
4. 强调色
强调颜色也是我们通常所说的highlight的颜色。在大多数情况下,品牌的主色调或辅助色调将被使用。当主色调不能广泛应用时,可以扩展其他颜色进行应用。它通常用于强调某些内容或文本,如我们的链接、姓名、特殊地址、按钮、图标等。
5. 互补色
互补色是对立于主色的颜色,用于提供对比度和吸引眼球。互补色的使用可以使品牌在设计上更有活力和引人注目。
7. 响应色
在建立品牌色彩结构时,应考虑不同设备和屏幕的性能。确保品牌颜色在不同的分辨率和屏幕上保持一致性和可识别性。在大多数情况下,响应颜色将使用品牌的主要颜色或强调颜色。
9. 颜色规范
颜色标准是将上述所有颜色的内容写入文档,建立一套颜色标准,定义主色、辅助色和其他颜色的具体值,以确保在各种媒体和平台上实现一致的品牌表达,便于在后续设计中继续应用。

*图片来自网络
在设计品牌色彩结构时,我们需要遵循一些规则,以确保品牌的视觉识别和一致性。以下是我梳理的一些主要规则:
①一致性
一致性主要是在应用中,也就是说,如果我们设置了一套完整的颜色系统或颜色结构,我们需要确保品牌颜色在任何场景或媒体下都是一致的。
例如,谷歌品牌系统颜色的延伸设计(如下图所示)

②目标受众
需要考虑用户对品牌颜色的接受程度,尽量选择用户喜欢或常见的颜色作为品牌主色调,并根据这个方向设计出更先进的颜色纹理。

*图片来自网络
③品牌价值观
色彩是品牌传递的直观工具。正如我们上面所写,不同的颜色代表不同的情绪和情绪。因此,在设置品牌色彩时,我们也需要结合色彩情绪来定义。

*图片来自网络
④差异化(可识别性)竞争对手
品牌色差异化是品牌设计师最基本的思维理念,避免与竞争对手重叠,确保自己的品牌色与竞争对手有足够的差异化,从而产生独特性,让用户或消费者记住产品品牌特征,从而提高自身品牌的可识别性,使消费者在看到品牌颜色时能够快速联想到自己的产品。例如,瑞幸和星巴克的差异化

*图片来自网络
⑤灵活性
色彩设置不应保持不变,结合品牌宣传或产品的需要,需要设计一定的色彩容错率或冗余。或者在设计开始时提前考虑多场景的应用,以确保品牌在不同的时间段和场景下具有较高的灵活性。例如,应用程序的品牌特征,每年的品牌会议,品牌标志的设计都会改变,然后品牌色调也会有一个特定的设计。

*图片来自网络
行业和行业直接使用颜色有一定的认知障碍,当然,认知不是,而是长期受环境的影响,如黄金企业或餐饮企业,不太可能设置品牌颜色为冷色,科技公司很少设置品牌颜色为大红色。
色彩认知会直接烙印在人的大脑中,行业的色彩壁垒也会受到基层逻辑的影响,如长期看到的影响或人类作为生物的自然认知,会导致不同行业之间的色彩壁垒。
不同的行业通常有特定的配色方向来反映品牌的特点和业务性质,但这不是唯一的选择,而是设计行业多年发展的趋势。设计师可以根据一些趋势大胆提出自己的想法,帮助品牌所有者在行业红海中突出自己的品牌基调。
1. 科技行业:
大多数科技产业以蓝色为主,蓝色通常代表创新、信任、可靠性和平,少数绿色或红色。

*图片来自网络
2. 金融行业:
蓝色和金色通常是金融业常见的颜色。蓝色可以表达一种商业氛围。选择较深的蓝色会表现出一丝平静的气质。金属通常用作辅助颜色,用于一些产品宣传材料。金色给人一种自然的尊严感。正如前面提到的,金属具有VIP的情感氛围。

*图片来自网络
3. 医疗行业:
医疗行业最大的色彩认知是蓝、绿、白,给人一种平静、干净、安全的感觉。白色和灰色用于提供专业性,而绿色和蓝色用于传达健康和舒适。

*图片来自网络
4. 食品及餐饮业:
特色颜色:红色、橙色和黄色在食物和餐饮中很常见,因为它们能刺激食欲和活力。
中性颜色:常使用中性棕色、米色或黑色(日本商店喜欢使用黑色作为主要品牌颜色),以与食品本身形成对比。

*图片来自网络
5. 时尚行业:
时尚行业经常看到黑色、白色和灰色,但时尚行业受到消费程度和季节性趋势的影响。品牌设计越先进,就越简单,这也导致了品牌色调的简洁,如GUCCI、LV等大品牌的颜色都是黑色的,但这并不影响他们在产品设计中使用其他颜色,这是品牌颜色“灵活性”的最佳体现

*图片来自网络
6. 艺术与文化产业:
艺术行业很少有特定的颜色,因为整个行业跨度相对较大,每个人对艺术的认知都很少有固定的认知。

*图片来自网络
男性、女性和儿童的色彩设计差异
男女甚至儿童的色彩设计也有一定的差异。男女之间的色彩差异更容易划分。从男女心理学的角度来看,男性更理想,女性更感性。因此,这两个方向的色调差异是由儿童造成的。从非严格意义上说,任何颜色都适合儿童。
男性行业的颜色是冷色,如蓝色、绿色或黑白灰色,而女性行业的颜色是暖色,如粉色、紫色、红色、黄色和金色...等等。但儿童行业的颜色通常使用明亮、活泼、丰富多彩的颜色,以吸引儿童的注意,传达快乐、友好和有趣的感觉。

*图片来自网络
背景色是我们设计中的一个重要因素。控制背景色与前景的关系可以大大提高设计的纹理。相反,如果背景色太引人注目,就会削弱主题,成为主人。
在设计背景色时,我们主要从几个维度考虑:
1. 保持一致性
保持与前景颜色的一致性,这样的背景颜色可以达到协调统一的美,如前景是一种暖色,我们只需要考虑设计背景颜色来降低饱和度或亮度

*图片来自网络
2. 对比突出
对比突出是一种大胆的设计方法,采用与前景相辅相成的颜色进行设计,可以大大提高画面的跳跃感,提高一些活跃度。

*图片来自网络
3. 使用中性色
如果你不注意背景中使用什么颜色,你可以考虑使用一些中性颜色,如黑色、白色和灰色,或一些低饱和度的混合颜色,如绿色

*图片来自网络
4. 使用最接近背景物体的颜色
如果前景有一定的空间感,我们可以考虑使用最后一个物体的颜色作为背景颜色。实现空间的延伸。

*图片来自网络
5. 使用品牌主色调或辅助色调
比如discord或者apple的设计,往往直接用品牌色或者辅助色作为网站设计的背景色,可以直接给人视觉上直观的色彩色调。

*图片来自网络
PantoneMatching System(PMS)是一种广泛应用于色彩标准化的色彩匹配系统。它是由美国公司Pantone制成的 LLC开发旨在提供一种标准、准确的方法,以确保相同的颜色能够在不同的媒体和设备上准确再现。

潘通根据不同的场景开发了两种场景使用的颜色系统,一种用于平面设计,编号为“PMS“开头;另一种是家居+室内装饰的应用,分别是“TCX” 指纺织品,“指纺织品TPG” 指颜料和图层。

潘通研究了1.5万多种颜色。目前,设计软件主要与Adobe合作,并为用户提供独立的应用程序。
我们可以在潘通的官方网站上学到很多关于颜色趋势的文章。我相信这对你喜欢颜色设计会很有帮助。网站:https://www.pantone.com/hk/tc/articles/colors

潘多年来发布了许多年度主题色,我们可以来看看每年的色彩。详情请访问网站:https://www.pantone.com/hk/tc/articles/color-of-the-year

当我们设计时,我们大多数人使用软件来吸收颜色,这无疑是设计师最方便的工具,但如果你不是设计师或你懒得打开设计软件,那么这些颜色工具将对你非常有用。
1. Adobe Color Wheel
Adobe Color Wheel是Adobe提供的在线配色工具,可以帮助用户选择、调整和预览颜色方案。
链接:https://color.adobe.com/zh/create/color-wheel

2. Color Hunt:
Color Hunt提供了各种由设计师创建的精选颜色方案,用户可以浏览、筛选和获得相应的颜色值。
链接:https://colorhunt.co/

3. Paletton
Paletton是一种在线色彩方案设计工具,用户可以通过选择基本颜色来生成单色、对比色、三角形配色等方案。
链接:https://paletton.com/#uid=13h0u0kleqtbzekgvuipcmgtdhzzhzhzhzzh

4. WebGradients
WebGradients是一种提供丰富渐变颜色方案的在线工具,用户可以预览渐变效果并获取相应的颜色代码。
链接:https://webgradients.com/

5. Image Color Picker
Image Color Picker是一种在线取色器,用户可以上传图片或提供图片链接,然后点击图片获取所选位置的颜色信息。
链接:https://imagecolorpicker.com/


6. HTML Color Codes
HTML Color Codes是一种简单的在线工具,用户可以通过选择颜色或输入颜色代码来获取颜色信息。
链接:https://htmlcolorcodes.com/color-picker/

7. ColorHexa
ColorHexa是一种强大的在线色彩工具,它提供了对色彩的详细分析,包括各种颜色表达、色板和相关信息。
链接:https://www.colorhexa.com/926471

8. Coolors
Coolors是一种在线配色工具,提供创建、调整和探索配色方案的功能。用户可以使用该工具生成随机的颜色方案,并获得相应的HEX和RGB值。
链接:https://coolors.co/

9. CSS Gradient Generator
CSS Gradient Generator是一个在线渐变生成器,用户可以选择颜色和渐变类型,然后获得相应的CSS代码。
链接:https://cssgradient.io/

如果我们不知道设计中使用的颜色是否过于泛滥,我们可以通过“灰度”来测试。灰度是一种常见的设计技巧。通过黑白灰模式,我们可以看到整体设计的色彩状态、色彩平衡感和饱和度。
在日常设计中,我们需要在大多数场景中使用它,如摄影、KV头图设计、插图设计、品牌色彩应用、图标设计等。
测试灰度的方法也相对简单。我们可以通过软件的着色功能或将饱和度调整到最低来测试。着色后,我们可以通过色阶检查黑、白、灰的颜色。
案例一:摄影图片
如下图2所示,图1:黑、白、灰的分布保留,深、灰相对较多;图2:没有深色调,整体图片灰色调较多。


案例二:海报图
如下图2所示,图1:黑白灰色调均衡;图2:缺乏深色调,整体颜色较浅。


今天分享的内容属于色彩设计中的一些基本内容。更多的色彩设计需要结合实际产品、内容和场景进行发散和重新定义,使设计的内容更具支撑性和落地意义。
欢迎关注作者微信微信官方账号:「DD设计站」
