色彩构成——色彩基础知识
有光才有色,而色彩的产生,是由于物体都能有选择地吸收,反射或是折射色光。
简单来说, 物体呈现了什么颜色,就是物体反射了什么颜色的光 。
例如:白光照射白纸呈白色,蓝光照射白纸呈蓝色。
通常:
并且,光源色的光亮强度也会物体色彩产生影响:
物体色是指 光源色 (固有色指的是 阳光下物体所呈现的色彩效应)经过物体的有选择地吸收和反射,反映到人的视觉中的光 色感觉 。眼睛所看到的色彩就是物体的物体色。
人们习惯将阳光下物体呈现的色彩效应的总和称为固有色。
实际上,生活中物体所呈现的色彩并非固定不变,经常会受到光源色和环境色的影响。(譬如前面提到的光源色的影响)
固有色比物体色更加概括和凝练,更能反映事物的本质,能更加简洁准确地传达设计色彩信息。
那么色光三原色与色料三原色的不同之处到底在哪里呢?简单的来说,色光三原色是发光体,而色料三原色是将不能吸收的光反射出来。
我们人眼中三种视锥细胞分别用来感知光中红色、绿色、蓝色的强度,所以我们所感知到的色彩都是由红色,绿色,蓝色叠加而成。所以色光三原色属于光的叠加模式,而色料三原色是通过吸收光的颜色(反射不能吸收的光)形成的,所以它为色光的减色模式
将色光三原色两两混合便得到了色料三原色。(黄色,青色,品红)
譬如:我们看见的青色:是物体吸收了红色,反射了蓝色和绿色,蓝色和绿色混合在一起便成了青色。
还有CMYK色彩模型,是印刷所用,k代表的是黑色,因为black中的b已经被占用,所以便选用了k。
具有色相,明度,纯度三种属性
以 红橙黄绿青蓝紫 为基本色。
彩色系中的色彩的性质,由光的波长和振幅决定。
波长 ——色相
振幅 ——色调(明度,纯度)
(只有明度一种性质)
黑色,白色,灰色系列。
黑白系列 :按照一定的变化规律,由白色渐变到浅灰,中灰,深灰,再到黑色构成的系列
生活中,纯色占少数,更多的色彩包含了黑,白,灰的成分。
两种色光相混合,结果为白光,那么这两种色光就称为互补光。
一个原色与其他两种原色相混得出的间色之间的关系,称为互补关系
互补关系: 红绿,黄紫,蓝橙
在色彩设计中,利用互补色的特性,有目的的控制色彩的鲜艳度,对突出和调整色彩的对比效果具有重要的意义。
色相环
以色光三原色为基础,两两相混,得到六种颜色,再将相邻的颜色两两混合得到12种颜色,再继续混合便得到了24种颜色
红色和黄色混合,形成橙色。
也可以这么理解:想让红色变成黄色,就要不断的加入绿色,当绿色的值到达最高点时,此时的颜色是黄色,当绿色的数值为中间值则为橙色
色环(牛顿色环)
色彩表示的三维空间形式,即色立体
由色立体,我们可以看到PS中的纯度,明度变化:
HSB色彩模型:
H hum 色相
S saturation 饱和度
B brightness 明度 (最低为黑色,最高为颜色本身)
HSL色彩模型:
H hum 色相
S saturation 饱和度
L lightness 明度 (最低为黑色,最高为白色)
色光的混合:明度增高,纯度也增高
色料混合:纯度,明度越低
分为:物理混合和生理混合。生理混合,明度既不增加,也不减少,是相混色彩明度的平均值。
分为:旋转混合,空间混合
色彩搭配基本知识
是指对色彩进行合理地搭配,取得更好的视觉效果。色彩的意义与内容在艺术创造和表现方面是复杂多变的,但在欣赏和解释方面又有共通的国际特性,可见它在人们心目中不但是活的,也是一种很美的大众语言。
两种以上色彩组合后,由于色相差别而形成的色彩对比效果称为色相对比。它是色彩对比的一个根本方面,其对比强弱程度取决于色相之间在色相环上的距离(角度),距离(角度)越小对比越弱,反之则对比越强。
1) 无彩色对比: 无彩色对比虽然无色相,但它们的组合在实用方面很有价值。如黑与白 、黑与灰、中灰与浅灰,或黑与白与灰、黑与深灰与浅灰等。对比效果感觉大方、庄重、高雅而富有现代感,但也易产生过于素净的单调感;
2) 无彩色与有彩色对比: 如黑与红、灰与紫,或黑与白与黄、白与灰与蓝等。对比效果感觉既大方 又活泼,无彩色面积大时,偏于高雅、庄重,有彩色面积大时活泼感加强;
3) 同类色相对比: 一种色相的不同明度或不同纯度变化的对比,俗称同类色组合。如蓝与浅蓝(蓝+白)色对比,绿与粉绿(绿+白)与墨绿(绿+黑)色等对比。对比效果统一、文静、雅致、含蓄、稳重,但也易产生单调、呆板的弊病;
4) 无彩色与同类色相对比: 如白与深蓝与浅蓝、黑与桔与咖啡色等对比,其效果综合了 (2) 和 (3) 类型的优点。感觉既有一定层次,又显大方、活泼、稳定。
1) 邻近色相对比: 色相环上相邻的二至三色对比,色相距离大约30度左右,为弱对比类型。如红橙与橙与黄橙色对比等。效果感觉柔和、和谐、雅致、文静,但也感觉单调、模糊、乏味、无力,必须调节明度差来加强效果;
2) 类似色相对比: 色相对比距离约60度左右,为较弱对比类型,如红与黄橙色对比等。效果较丰富、活泼,但又不失统一、雅致、和谐的感觉;
3) 中度色相对比: 色相对比距离约90度左右,为中对比类型 ,如黄与绿色对比等,效果明快、活泼、饱满、使人兴奋,感觉有兴趣,对比既有相当力度,但又不失调和之感。
1) 对比色相对比: 色相对比距离约120度左右,为强对比类型,如黄绿与红紫色对比等。效果强烈、醒目、有力、活泼、丰富,但也不易统一而感杂乱、刺激、造成视觉疲劳。一般需要采用多种调和手段来改善对比效果;
2) 补色对比: 色相对比距离180度,为极端对比类型,如红与蓝绿、黄与蓝紫色对比等。效果强烈、眩目、响亮、极有力,但若处理不当,易产生幼稚 、原始、粗俗、不安定、不协调等不良感觉。
色彩本身并无冷暖的温度差别,是视觉色彩引起人们的心理联想,进而产生冷暖感觉的。
红色的频率最低,衍射性强。它使人联想起太阳、火焰、热血、花卉等,感觉温暖、兴奋、热情、豪放、轰轰烈烈、充实、饱满、幸福等,但有时也被认为是幼稚 、原始、暴力、危险、卑俗的象征。
橙与红同属暖色,具有红与黄之间的色性,它使人联想起火焰、火光、霞光、橙子等物象,是最温暖的色彩。感觉活泼、跃动、炽热、温情、甜蜜、幸福竺,但也有疑惑、嫉妒、伪诈等消极倾向性表情。
黄色的频率适中,是众多色彩中最温暖的色,给人轻盈,灿烂,温暖,充满希望的色彩印象。由于此色过于浮夸,被认为轻薄,冷淡;性格非常不稳定容易发生偏差,稍添加别的色彩就容易失去本来的面貌。黄色还被用作安全色,因为它有警戒作用,如室外作业的工作服。
绿色是大自然的颜色,大多数植物的颜色,现在非常提倡的环保生活都是采用绿色为主色调,健康无污染。代表着春天,在策划设计春天相关事物活动,可以使用绿色为主色进行设计。绿色是有着安全属性的,在支付、保障方面通常是应用很多的,与红色正好是相反的作用。
青是介于绿色和蓝色之间的一种颜色,它象征着坚强、希望、古朴和庄重,传统的器物和服饰常常采用青色。
与红、橙色相反,是典型的冷色调,蓝色非常纯净,通常让人联想到海洋、天空、湖水、宇宙。纯净的蓝色表现出一种美丽、梦幻、冷静、理智、安详与广阔。
紫色是一个高雅的富贵的色彩,与幸运和财富、贵族和华贵相关联。紫色跨越了暖色和冷色,所以可以根据所结合的色彩创建与众不同的情调。
黑色为无色相无纯度之色。往往给人感觉隐藏、沉静、神秘、严肃、庄重、含蓄,另外,也易让人产生悲哀、恐怖、不祥、沉默、消亡、罪恶等消极印象。
白色给人印象中洁净、光明、纯真、清白、朴素、卫生、恬静等。在它的衬托下,其他色彩会显得更艳丽、更开朗。
灰色是中性色,其突出的性格为柔和、细致、平稳、朴素、大方、它不像黑色与白色那样会明显影响其他的色彩。
色彩知识点总结
从最基础的色彩本质、色彩搭配形式、及色彩对用户的潜在影响和心理暗示等着手,去分析色彩,读懂色彩,下面是色彩知识点总结,欢迎阅读了解。
色彩是什么
色彩是可见光的作用所导致的视觉现象。光是一种电磁波,不同波长的可见光投射到物体上,一部分被吸收,一部分被反射进入人眼,大脑再把这种刺激反映成色彩信息。所以说,没有光,就没有色彩可言。
色彩三要素
色彩的三要素包括色相,明度,饱和度。
色相作为色彩的首要特征,它指的是色彩的相貌,是我们区分不同颜色的判断标准。色相由原色、间色和复色构成,且色相是无限丰富的。
明度,即色彩的亮度,明度反映的是色彩的深浅变化,一般情况下在颜色中加入白色,明度提高,加入黑色,明度降低。
饱和度即纯度,指色彩的鲜艳程度。纯度越高,色彩越鲜明,纯度越低,色彩越黯淡。
色彩分类
1.原色: 色彩中不能再分解的基本色称为原色。通原色能合成出其它色,而其他色不能还原出原色。色光三原色为红、绿、蓝,与之对应的便是我们常常提到的RGB。
2.间色: 由两个原色混合得间色。色光三间为品红、黄、青。颜料三原色指橙、绿、紫。
3.复色: 由原色与间色混合,或间色与间色混合而成的色彩。复色中包涵全部三原色,只是三原色的比例不同。
色彩渊源
中西方艺术的发展背后是两种不同的色彩观,一种是宗教的,感性的。一种是科学的,严谨的。西方艺术从基督教中衍生出来,从神学走向科学。背后的文化逻辑源于 亚里士多德的科学逻辑。而中国文化中的色彩观以阴阳五行及儒道玄禅为基础。下面我们概括的讲讲东西方各自色彩观的形成过程 。
东方
中国到现在为止还没有一套十分科学严密的色彩色彩理论体系,这与中国绵延了两千多年的封建社会有着密不可分的关系。封建社会一直认同的色彩体系是建立在阴阳 五行基础之上的五行色彩学说,分别指赤,黄,青与黑白无色。所谓“东方谓之青,南方谓之赤,西方谓之白,北方谓之黑,天谓之玄,地谓之黄”又有“土黄、金 白、木青、火赤、水墨”一说。在此基础上,封建社会自上而下实行严密的“色彩统治”,自明清开始黄色开始被定为皇家专用色彩,且老百姓值得穿布衣,着白 色,粉色等素色衣物,高纯度的色彩只在贵族间流行。所以这么看来,现在的中国人这么喜欢高彩度的色彩,如大红,大绿等也可以理解。因为她们对于色彩的需求 被压抑了太久,一旦这种规则被破除,便会井喷一样的爆发出来。色彩的搭配讲究完整性,一旦色相环中的一些色彩被禁止,将会破坏整体的色彩搭配体系。所以直 到现在,中国在无色说之上没有取得进一步的发展,也没有形成完整严密的色彩理论体系。我们的邻国日本丛明治维新时期就开始引进色彩学,并且在明治9年那么 早的期间在小学即已开设色彩学课程。直到当代,中国专业的色彩机构还是非常少,因此在色彩上还没有办法和发达国家对接。
西方
早在文艺复兴时期,达芬奇就提出:“全部的色彩来源于光,没有光,就没有色彩,就什么也看不见。黄色是大地、绿色是水、兰色是天空大气、红色是火、黑色是黑 暗”。牛顿是西方色彩史上的'开山鼻祖,著有《光学》一书,且通过三棱镜原理发现了光的七色原理。自牛顿开始,西方的色彩科学开始一步步发展下去,直至 100年前美国的色彩学进入成熟期,开始领军世界,其中最著名的便是 先生,今天各个行业里使用的蒙赛尔体系即为他所创造,(蒙赛尔体系是用立体模型来表示颜色的一种方法),至此色彩的三属性(明度、彩度、色相)体系 初步确立。
因为色彩学早已被贯彻进西方社会每个相关领域,如建筑、服装、装饰、广告等。色彩的选择,不是简单的几个有品位的人就可以决定的,需要一套严谨的科学体系。其次,色彩科学被引进教育体系中,使得整体国民美学素质得以提升。这些都是是我们要向西方先进国家学习的。
色彩的感官特性
色彩可以调动我们某种特定的情绪,激活我们某种特定的感受。近年来,关于色彩心理学,色彩性格学说也越来越走俏,那么究竟色彩有哪些特点,能给人带来什么影响?这里我们大致整理一下。
色彩的冷暖
色彩的冷暖是人们在长时间的生活中积累的颜色感觉。且冷暖是个相对概念,因人而异,毕竟每个人的生活环境都不同。通常情况下,红色,橙色,粉色使人联想到火 焰和太阳等事物,让人感觉温暖。蓝色,紫色使人联想到蓝天冰雪等事物,让人感觉寒冷。色彩的冷暖特性经常被应用在日常设计之中。夏季炎热,电风扇必不可 少,电风扇的颜色大多为白色,极少数电扇是红色,橙色。虽然吹出的风是一样的,但红色电扇更容易让人产生热的感觉。同样在室内设计方面,冷色的装修风格使 人感觉凉爽。实验表明,暖色与冷色可以使人对房间的心理温度相差2~3 。
色彩的重量
色彩本身没有重量,只是一种抽象的感受。举个例子,同等大小的10吨重锤,黑色款看上去明显更重一些。我们经常讲黑色厚重,深沉。白色轻盈,活泼。其实 在我们在生活中使用这些形容词的时候就已经在潜意识里给两个颜色标注了重量。当人在无法用物理方法精确衡量物体重量时,往往就会不自觉地用情绪体验来进行 度量。这时对于色彩的感知就排上用场。色彩的重量规律,相同颜色明度越低感觉越重。饱和度越低的颜色感觉越重。
色彩的扩张性
做个实验,在两个大小,形状相同的形状里填入不同的色彩,A,B。将AB组合到一起,会明显的发现A的形状要大于B。色相上,诸如红色,橘色等暖色系 色彩有扩张感。蓝,紫等冷色系色彩具有收缩感。明度上,越亮的色彩扩张感越强。越暗的色彩收缩感越强,尤其是黑色。色彩的扩张性在设计中有着广泛的运用, 以时装为例,深色系的服装显瘦,亮色系服装显胖,这似乎是任何人都知道的道理。在绘画中,合理利用色彩的扩张性对画面的平衡起着重要的作用。
色彩的进退感
处于人眼相同距离的色彩,有的在前面,有的在后面。这便是色彩的进退感,即色彩在对比过程中产生了先后关系。一般来说,补色的对比最强烈,所以视觉上两块颜 色的前后关系最明显。“红一绿”、“黄一蓝”和“白一黑”三组补色组合中,具于前面的是红色,黄色和白色。从明度方面讲,明度高的在前,明度低的在后。从 饱和度方面讲,高饱和度色彩在前,低饱和度色彩在后。当我们进行设计工作时,可以利用色彩的进退特性来制造空间感,也可以利用它强调主体物。化妆时,眼影 通常使用深色就是利用这一原理来塑造眼窝的立体感。日本的插花艺术中,通常把颜色偏冷的花放在后面,把暖色系的花放在前面以制造纵深感。
色彩涵义
其实色彩本身是没有意义的,但色彩可以使我们联想到某种事物,或某段回忆,进而影响我们的情绪。人其实是靠着经验与习惯生活的,而色彩能够使我们联想到曾经 的经验与习惯,于是色彩也就有了意义,这意义不是色彩本身的,而是色彩背后所代表的事物带给我们的。色彩是很难被理性衡量的,不同的人看到色彩有各自不同 的感受,例如大部分人看到绿色会想起植物,生命等积极性的东西,但也有人会联想到绿帽子,因为他曾经被这样悲催的感情生活伤害过,他可以说自己讨厌绿色。 但我们刨除这些个别的元素,而选取大部分常规情况来看,色彩之于人们的含义是有大量共性存在的。这里我整理了一些常规的含义展示给大家。
色彩搭配
搭配方式
常见的搭配方式有单色搭配,近似色搭配,补色搭配,分裂补色搭配,原色搭配。
搭配原则
色彩的搭配方法有很多种,这里介绍一种我个人比较认同的方式。日本设计师まりっぺ提出70%,25%,5%的配色比例原则,画面中70%为底色,面积最大的 一块,往往画面的色调是有底色决定的。25%面积的为主色,画面的核心区域多使用主色 区。5%为强调色,强调色在画面中起到华龙点睛的作用,强调色多使用 与主色对比度较大的颜色,也可以尝试利用色彩的互补关系来突出。
当然,在实际工作中,很多时候画面不会只有3中颜色。遇到这种情况时,まりっぺ 主张在现有的配色方案中进行切割,从而不影响配色比例。
色彩模式
常见的色彩模式有RGB,CMYK,HSB几种。RGB是色光显示模式,也是绝大多数电子显示频运用的模式。RGB分别指红绿蓝三个颜色,他们也被称为色光 三原色。根据光学原理,人眼中识别的颜色是物体反射的光波,当光波投射到人眼时,越多的色光叠加,颜色就越亮。电子屏幕中的每一个像素都有红绿蓝三色组 成,然后这三色分别以不同的明度组合显示各种色彩,在此基础上千万个像素以不同的色彩拼合成一副完整的画面。
CMYK通常指的是印 刷色彩系统,颜料的特性与色光相反,越叠加越黑,所以颜料的三原色必须是可以吸收R,G,B的色彩,也就是RGB的补色:青,洋红,黄色,由于不存在完美 的颜料,所以完美的黑色是无法通过叠加调和的,所以在这三色基础上加入了黑色。RGB与CMYK虽然是不同的色彩系统,但通常情况下,他们是可以互相转化 的。
与RGB与CMYK的色彩形成原理不同,HSB模式的色彩原理更符合色彩属性原则即色相,明度与饱和度。这也更符合人眼的判断 原理。H代表色相Hue,S代表饱和度Saturation,B代表亮度Brightness。在实际使用的时候较RGB与CMYK模式都要方便一些,在 此推荐设计师在调色的时候可以尝试这用一下。绘图软件通常都装有这个色彩模式。
色彩设计基础知识整理
产品设计: 工业设计、UI设计、书籍报刊设计等。重点在于品牌印象,清晰、舒适、耐看。诱目性低,可以长时间凝视而不会疲劳。
运营/推广设计: 海报、广告、招贴等形式。重点在于氛围营造,吸睛、具有较强的表现力。诱目性高,瞬间吸引人的注意力。
区分层次;渲染氛围;强化主题;关联传达品牌特性;
H(hues)色相: 红、黄、蓝等色彩的种类;根据位置来划分色彩的邻近色、对比色等。
色相会具有一定的偏向性,如偏蓝色的绿色/偏黄色的绿色,在与其他颜色搭配师,不同的偏向性会产生不同的效果。
从色彩属性上,可以分为冷色与暖色。蓝色、紫色等冷色表现出清凉、冷静的感觉。黄色、橙色等暖色给人温暖的感觉。
S(saturation)纯度/饱和度:色彩的鲜明程度,为0时为灰色;
B(brightness)明度/亮度: 色彩的明亮程度,最高为白色,最低为黑色;明度高:轻快、明亮;明度低:厚重、沉着。
明度差大:力量、有活力;明度差小:高雅、平稳。
RGB:红、绿、蓝;加色混合(混到一起成为白色),屏幕所用色彩表现方式。
CMYK:青、品红、黄、黑;减色混合(混到一起成为黑色),印刷所用的色彩模式
色调系列: 色彩的不同明度和纯度的组合,色调由纯度和明度交叉创造而成。不同的色调会给人留下不同的心理印象,决定画面的氛围。
决定画面的三要素是色调、色相和对比强度。
色调差小,则对比小,平稳和谐;色调差大,则对比较强,变化而有力量。
淡色调(P)
心理印象:温柔、梦幻、轻盈、轻、淡、浅,多用于化妆品、婴儿用品等。
浅色调(LT)
心理印象:清爽、轻松、明快、轻、淡、浅,多用于化妆品、儿童用品等。
浅灰色调(LTG)
心理印象:素雅、温柔、消极、成熟、雅致。
轻柔色调(SF)
心理印象:质朴、消极、平和、成熟。
明亮色调(B )
心理印象:轻快、活泼、童真。多用于儿童用品。
强烈色调(S)
心理印象:强烈、有深度、充满热情的印象。
鲜艳色调(V)
心理印象:华丽、热闹、刺激、鲜明。
灰色调(G)
心理印象:资深、沉稳、厚重、成熟、含蓄、保守、消极。
浊色调(D)
心理印象:钝化、厚重、质朴、稳重、高级。
深色调(DP)
心理印象:沉着、干练、稳重。
暗灰色调(DKG)
心理印象:稳重、沉闷、质朴、厚重。
暗色调(DK)
心理印象:厚重、阴暗、稳重、质朴。
暖色:红、黄、橙等,让人联想到火焰、温暖的太阳等比较温暖的事物;
冷色:蓝色、绿色、紫色等,让人联想到冰、雪等比较凉爽的事物;
前进色:看着比实际上离自己近,膨胀色,一般是暖色,偏白的颜色;
后退色:看着比实际上离自己远,收缩色,一般是冷色,黑色等;
膨胀色:暖色、明度较高的颜色,让物体看起来感觉比实际更大;
收缩色:冷色、明度较低的颜色,让物体看起来感觉比实际更小;
色彩的重量感:黑色比白色显得更重,更牢固。明度越低,显得越有重量。反之,显得越轻。
不同色调的心理印象:
将色彩分为5个角色:主角色、配角色、支配色、融合色、强调色。
主角色: 配色的中心色,其他颜色以此为基准。
主角色决定主体,使画面整体安定。要用最强色。面积不需要多大,但是要有力度。
配角色(突出色): 衬托主角、支持主角,专门设置在主角近旁,使主角突出。
配角色增加对比,在一成不变的色彩中增加变化,突出主角色。面积与主角色形成差异,会增强对比的效果(如主角色面积较大时,面积越小的配角色效果越好)。
支配色(背景色): 作为背景环抱整体的颜色。即时小面积也能支配整体感觉。
背景色支配着画面的整体感觉。背景色包围主体,即使面积小,在观众的心中会“看到”主角背后的背景色,所以也会支配整体的感觉。
融合色: 主角色游离其他色时,置同系色于游离处,起到融合整体的作用。
但两种颜色对立过于激烈时,加入融合色,起到缓和矛盾的作用,使整体更加平稳。
强调色: 在小范围点上强烈的颜色,使画面整体更加鲜明生动。
强调色让页面的变化更加强烈,增加整体的活力。同样,面积与主题差异较大,可以增加对比效果。
首先需要明确设计的目的是什么、内容是什么、受众是谁。
设计是解决问题的一种方式,了解产品的形象、用户的角色,可以明确整体所要表现的风格气质,明确我们要解决的问题以及解决问题的思路与方向。如考虑不同年龄、不同性别、不同层次用户对于色彩的偏好。孩童一般喜欢明度和纯度比较高的色彩;老年人一般喜欢明度和纯度都较低的色彩。这样在选取颜色的时候才会有方向、有目标。
了解设计的内容可以关注技术的限制、观看距离的远近以及周围环境的影响。如平面设计一般采用cmyk模式,UI设计一般采用rgb模式。观看距离较远时,需要较强的对比度,增加识别性;反之,距离较近时需要更加柔和,让观者的眼睛不会疲劳。而夜晚模式的使用更是对于光线不足时的一种反应。就环境影响而言,如果产品周围的物体、产品等颜色比较花哨、丰富,那么选用简单、无彩色的配色会更加容易从中凸显。
主色调选取,一般是品牌的主打色,同时需要与所要传达的主题气质相符合。主色所占的比例一般会比较大,对整体风格起到一个主导作用。
对于公司内部的产品,一般考虑公司的品牌色。对于新的、toC的产品,可以使用情景版的方式来确定主色。或者使用行业/客户特定的色彩,如针对中国电网设计产品,考虑使用其绿色作为主色。
主色确定之后,单色配色一般是在色彩的明度、纯度上发生变化,并且加上黑白灰等无彩色来形成配色方案。双色配色可以考虑类似色、对比色、互补色等配色方式,一般而言,与主色在明度和纯度上的差异不会太大。多色配色可以考虑三角形、四边形、五边形的配色方式。
色彩的对比强度,可以是色相、明度、纯度任一方面。需要依据整体的感觉、气质需要来选取和调整。激烈、热闹的氛围需要比较大的对比度,柔和、安静的氛围需要不太强的对比。
色彩的冷暖感:如果都选用冷色或者暖色,整个画面就会偏冷或偏暖。除非有特殊的主题需求,一般多色配色时,会需要在全是冷色的颜色中加入暖色,或者在全是暖色的颜色中加入冷色来点缀与平衡画面的冷暖感。
色彩的明暗:色彩的明暗就像是画面的光影,有高光、有阴影物体才会有体积感。同样,颜色的明暗对比让画面具有层次感与纵深感。同时,全是亮色会显得浮躁,全是暗色会显得沉闷。
色彩之间的呼应: 整个画面之间的颜色并不是割裂的,这里一块那里一块独立存在。而是在元素之间穿插错落。色彩的呼应会让整体感更加明显,也更容易让画面变得和谐。
色彩的面积: 主色与辅色所占的面积大小一般会有所差异,形成对比。常见的比例有7:2:1,。整体的感觉与印象是不同面积色彩感觉之间拉扯的结果。
环境色/光源色的影响: 高光与阴影的颜色会受到环境色的影响,如黄色灯光下的物体,高光会偏黄色;蓝色背景上的物体,其阴影也会偏蓝色。在对元素填色时,需要考虑环境色/光源色的影响,在基础色的色相上偏向光源色或者多层叠加颜色来让整体细节更丰富、更有质感。
兼顾“突出”与“融合”两个方面: 在完成配色的方案后,要审视整体的方案与目标气质、定位基调的一致性。如果过于沉静,则下点功夫突出一下即可;如果过于喧闹,则像着沉浸、融合的方向调整即可。
取色板的右上角顶点为某一色相的纯色。水平往左,是逐渐加入白色的过程,颜色纯度逐渐降低;垂直往下,是逐渐加入黑色的过程,颜色明度逐渐降低。将取色板均等分为9个区域。每个区域的颜色会给人不同的感觉。与pccs的色调划分方式有些类似,在设计软件中选取颜色时运用比较方便。
色彩九宫格与给人的心理印象
1号区域-淡色调
心理印象:高明度低纯度,温柔、轻盈、梦幻、素雅、
2号区域-明色调
心理印象:高明度中等纯度,清爽、明亮、活泼、可爱。多用于儿童用品等。
3号区域-纯色调
心理印象:高明度高纯度,鲜艳、刺激、热闹、华丽、年轻化、冲击力强。多用于广告、海报等运营类设计。
4号区域-淡浊色调
心理印象:中等明度低纯度,素雅、格调、安静、朴实、舒适、平和。高级灰、莫兰迪色。
5号区域-浊色调
心理印象:中等明度中等纯度,坚定、质朴、安静、高级。
6号区域-暗色调
心理印象:中等明度高纯度,沉闷、成熟、沉稳
7-8-9区域-黑暗色调
心理印象:低明度,危险、高档、暗沉、厚重、阴暗
此区域的颜色,有人视为色彩禁区。颜色显脏不好搭配。当需要纯黑色的替代色时,可以考虑选取这几个区域的颜色,色彩可以偏向于主色的色相或者与主色协调的色相。
九宫格配色的使用技巧: 比较简单的方式是选择同一区块的颜色,在色相上产生变化。在多色配色的情况下可以取得较好的效果。也可以考虑明度与色彩的重量感,选用亮与暗、轻与重的颜色协调。
快速上手!10分钟学会这招超好用的「九宫格」配色技巧 - 优设网 - UISDC
用我自创的十字形配色法,让你快速入门配色! - 优设网 - UISDC
看过很多配色理论还是学不会?来看我总结的这3个实用技巧! - 优设网 - UISDC
色相一致的配色
各个色彩色相保持一致或者接近,通过明度或纯度变化来产生差异。
明度一致的配色
各个色彩明度保持一致或者接近,不会产生强烈对比感,整体会显得比较均衡。
纯度一致的配色
各个色彩纯度保持一致或者接近,纯度越高,刺激性越强,纯度越低,越显得沉稳;
同色系配色
色相不变,在纯度与明度上产生变化,形成配色方案。单色系配色,比较容易做出效果。
邻近色/类似色配色
色相跨度较小,容易形成比较清晰一致、意图明显的的效果。
中差色配色
色相环上颜色位置呈90°,具有一定的对比但不是太强烈,高级、华丽、干练。
对比色/互补色配色
色相环上二者成180°,对比强烈,容易形成炫光效果,一般会使用面积差异或者明度差异来让页面更加稳定。
三角形配色
色相环上颜色呈三角形,对比较为强烈、稳定。
四边形配色
色相环上颜色呈四边形,有一定的对比,色彩数量比较丰富。
五边形配色
以五边形的方式从色环选取颜色,色相之间的对比比较均衡。色彩数量丰富,热闹、活泼。
整体显得模糊时,应该删除暧昧模糊的地方,突出主题,大力强调作为主角的部分,整体更加清爽踏实。
当配色过于沉重压抑时,应该减少黑色,增加鲜艳颜色,提升明度、饱和度,整体明朗、生动。
对比越强,显得有活力、精神饱满;对比越弱,则更加安定、稳定。
加入对比色: 对比色是主色的补充,两者形成冲突。注意面积、明度、纯度、位置的调节,避免画面过于激烈、不协调。
准对比色带来平稳的对比: 比直接使用对比色的效果更缓和一些,即使用稍偏离对比色的补色。
全色相型: 色彩种类丰富,画面热闹、开放,类似五边形配色。
三角形配色: 平衡、稳定,类似三原色的配色。
十字型: 两组对比色,在色环上构成“十”字,有力度、紧凑。
黑色起突出作用: 黑色凸显出力量感,能够衬托出有彩色的鲜艳。
白色在不破坏画面感觉的基础上起强调作用: 白色作为中立色,不破坏其他颜色。可以作为强调色、间隔色。
用淡色群固定淡色主角: 淡色主角,背景色、辅助色等不应该过于强烈,抢过主角的风头。整体的淡色调,让画面氛围更加轻快。
加强中心部分的方法: 提高纯度;强化明度对比;强化色相对比;
加入鲜艳色彩: 鲜艳色调显得有活力,暗色调显得庄严、高雅。
减少一部分黑色: 与加入鲜艳颜色是一个道理,让色调往明亮、鲜艳方向靠近一些。
设置明度差: 也就是增加对比。对比产生力量、跃动的活力。色彩的对比包括色相、明度、纯度、面积的对比。
制造一个亮点: 抑制背景色,突出主题色的明度、纯度,与背景色拉大面积对比。
增大色彩面积: 画面过于单调、空洞,可以适当增加色彩的面积,减少留白,增加图版率和视觉度。(图版率高,整体更加活跃、热闹,适合快速浏览。图版率低,则更加安静、偏向于细细阅读,适合阅读、文档等应用的设计。详见 - 写文章 )
分离配色: 颜色之间不按照色相环的顺序排列,而是让对立的颜色放到一起,增加冲突,制造动感。
重心: 深色(明度低)在上,浅色在下,重心就会上移,不稳定而形成动感。防止,则重心靠下,更加安定。
画面色彩不协调/过于喧嚣,使用三属性(色相、明度、纯度)、位置、面积来缓和氛围,整体更加和谐。
色相靠近: 同系色、邻近色等,色相差异较小,测试稳定、温馨、保守、恬静的效果。
双色调: 色相相同或相近,色调形成差异,淡色明色/明色浊色等的组合。
对比双色调: 两组双色调,色相之间形成对比。双色调的平稳感与色相对比的紧凑感共存。
统一明度: 色相差异较大时,采用相同的明度,整体会给人安定的感觉。
靠近色调: 纯度与明度组成色调,同样的色调可以强化该色调带来的感觉,统一整体的画面氛围。
通过群化法收敛混乱: 将色相、明度、纯度中的一部分共通化,会得到统一感。
浓淡法: 按照色相的顺序或者明度的顺序配色,形成稳定的节奏感。
微差: 近似的色相与明度,整体会比较宁静。
灵活运用令人生厌的色调: 使用小面积强调色十分有效。强调色的选用:高彩度的同色系色彩、准高彩度的对比色彩、高明度色彩。
通过重复融合整体: 在不同的位置放置一样的色彩,形成呼应,整个画面更好地融为一体。
利用白色间隔使画面更柔和: 在过于浓艳的配色中使用白色间隔,可以缓和色相之间的强烈对比。
从自然中获取配色 :
选取自然风光的照片,进行马赛克处理,选取其中的颜色作为配色方案。
选择与主体一致的颜色:
设计材料中有一些必须加入画面的图片、图案等,可以在其中吸取颜色,作为字体、装饰元素的颜色。让整个画面更加协调。
插入间隔色:
主体与背景色、辅色等产生冲突时,可以在二者中间插入间隔色,进行一个区分、缓冲与过渡的作用。间隔色一般为无彩色或者浊色调色彩。
色彩印象:
婴儿→儿童→成年→中年 —— 浅色调、轻柔色调→明亮色调、鲜艳色调→强烈色调、浊色调→深色调、灰色调;
男性 —— 纯色,强对比;女性 —— 柔和、素雅,弱对比。
朝气、活力 —— 暖色、全色相;
可爱 —— 增加白色面积占比、在颜色中加入白色;
素雅 —— 淡雅明快的色调,弱对比;
豪华 —— 暖色、鲜艳色调、强对比;
自然 —— 明亮、素雅的浊色,在色调图中的轻柔色调、强烈色调、浊色调。
力量、速度 —— 鲜艳、厚重的色调,对比强烈;
幻想、神秘 —— 同色系,自然界中少见的;
渐变:
采用色调一致的颜色,通过色调来形成不同的氛围。
·同类色渐变:柔和、轻微、细腻。具有柔和的光影感。
·邻近色渐变:时尚、耐看、活跃
·互补色/对比色渐变:冲击力、吸引眼球、时尚。
先确定版式,再选择配色。
色彩的数量与协调:
有彩色的数量较多,容易形成热闹、绚丽的氛围。但是颜色数量越多,协调起来越难。色彩数量较少会比较有力量感,给人感觉更加坚定、方向明确;
可以在明度或纯度上保持相似性。也可以加入无彩色作为区分、过渡。或者将某一种颜色用在所有元素上,让整体更加统一。
多色配色:
色相、纯度、明度等至少要有一个保持一致或接近。如多色相的(色彩种类较多)时,应该保持各色彩的纯度和明度至少一个差别不大。要是都差别很大,则容易不协调。可以将其中一个颜色的明度或纯度提高,进行有意凸显与强调。
多色配色也要讲究颜色之间的呼应,如某些细节部分颜色与大面积色彩保持一致,而非一个颜色占据一块。
多色配色时,颜色之间的比例也需要权衡。比较均衡时,整体比较热闹。主次分明时,与大面积色的感觉更靠近。
叠加模式:
通过不同的叠加模式(柔光、叠加、颜色加深等),让图片或者色彩之间融合更加自然。
ColorMunki - ColorMunki Design
Color
Color Picker — A handy design tool from Color Supply
Color Hunt - Trendy Palettes for Designers and Artists
LOL Colors - Curated color palette inspiration
Coolors.co - The super fast color schemes generator
0-255
Color Scheme Designer 3_高级在线配色器_配色网
Material Design Color, Flat Colors, Icons, Color Palette | Material UI
中国色 - 中国传统颜色
CMYK 和 RGB 这两种色彩模式本质与区别在哪? - 知乎
《色彩设计的原理》的笔记-全书
快速上手!10分钟学会这招超好用的「九宫格」配色技巧 - 优设网 - UISDC
用我自创的十字形配色法,让你快速入门配色! - 优设网 - UISDC
看过很多配色理论还是学不会?来看我总结的这3个实用技巧! - 优设网 - UISDC
高手的平面课堂!最容易上手的配色方法 - 优设网 - UISDC
NCD WEB : NCD Busines : Image Scale System
PCCS_百度百科
色彩设计的原理 (豆瓣)
每天懂一点色彩心理学 (豆瓣)
PCCSの色相
配色基础原理 (豆瓣)
用一个实战项目,帮你掌握科学的 UI 配色方法 | 优设网 - UISDC
《 七日掌握 设计 配色 基础》