配色高手系列！聊聊“黑色”在电商设计里的常用搭配技巧！

@做设计的面条 ：鉴于在之前的一篇文章《高手课堂！5招带你玩转电商最常用的色彩搭配！》里我讲到了关于热闹促销型的电商设计最常用的颜色“红色”在电商设计里的运用，那么今天我就讲一下热闹促销型的电商设计最忌讳的颜色“黑色”在电商设计里的运用吧。

那么按照惯例，为了便于大家理解，我依旧是先给大家列个文章提纲咯：

1. 黑色的释义。

2. 黑色占比多少与活动定位之间的关系。

3. 黑色页面的常用色彩搭配技巧。

4. 与黑色有关的节日有哪些？

接下来我们一条一条来看吧，let’s go！～

1. 黑色的释义

先来自百度百科的解释：黑色可以定义为没有任何可见光进入视觉范围，和白色正相反，白色是所有可见光光谱内的光都同时进入视觉范围内。颜料如果吸收光谱内的所有可见光，不反射任何颜色的光，人眼的感觉就是黑色的。如果将三原色的颜料以恰当的比例混合，使其反射的色光降到最低，人眼也会感觉为黑色。所以黑色既可以是缺少光造成的（漆黑的夜晚），也可以是所有的色光被吸收造成的（黑色的瞳孔）。

而我自己的理解是：黑色它不仅是一种百搭色，它很特殊的一点就在于，你会发现几乎所有的书本报纸杂志正文部分以及你平时的书写基本都是黑色的而不是其他颜色，中国的水墨画毛笔字也基本都是黑色的，所以黑色会给人一种有文化底蕴的感觉；

同时它在气质上他还给人一种坚硬、神秘、端庄、静寂的感觉，但在一些文化习俗上黑色又常常意味着不吉利，在功能上比如在服装设计里黑色又往往能起到一种视觉上显瘦的效果。

我将以上这些都统称为黑色的属性。

△  左图显端庄优雅又显瘦，右图水墨画显文化古韵

2. 黑色占比多少与活动定位之间的关系

只要一提到电商页面设计，我相信大多数人在脑海里的闪现的应该是彩色的页面而不是黑色的，除非品类需要或产品本身就是黑色，大部分老板也不会同意你把一个电商页面设计成黑色（一些开明的老板除外），但黑色真的这么招人忌讳吗？黑色就真的不太适合应用于电商设计里吗？其实主要是你没有弄懂黑色占比与活动定位之间的关系罢了。

我们用2张海滩照片做举例：

△  左边是炎炎烈日的大白天／右边是夜深人静的夜晚

大家看完后是什么感觉呢？左边的沙滩是不是感觉很热辣阳光看着就很热？而右边的黑夜感觉很宁静神秘遥不可及？

我们都知道晴朗的白天和静谧的夜晚是对立的，彩色跟黑色是对立的，他们给人传递的感受也是对立的，就好比下面这2种页面，他们所传递的定位也是截然对立的：前者活泼热闹促销，后者冷酷高端。

这种定位规律在一些产品包装上也适用，比如下图：

△  左边是几百元的相宜本草套装，右边是上万一套的日本顶级护肤品牌POLA套装

再取几个折中的案例，多彩色VS黑色与多彩颜色相结合的时候：

△  虽然同样很时尚，但是左图更年轻清爽活力，右图因为加入了黑色的缘故显得更炫酷大牌

△  虽然同样很时尚，但是左图更年轻清爽活力，右图因为加入了黑色的缘故显得更加妩媚大牌

所以我们不妨可以这么理解：一个页面活泼与否，定位如何，其实关键就在于黑色或暗色在这个页面里的占比有多少。

黑色占比越多，那么这个页面的黑色属性也就越多，所以会体现出诸如神秘、刚强、高端、高冷甚至是恐怖等气质，让人产生距离感，常用于一些想要体现高端产品定位印象的页面或产品设计里，任何类目都适用：

而彩色占比越多，整个画面就越活泼热闹沸腾，仿佛是有什么活动表演或者派对，给人一种有亲和力人人都买得起的感觉，常用于一些要体现活泼年轻定位的产品或页面设计里，同样适用于任何类目：

而白色占比越多，整个页面就越干净、圣神、明亮，给人的感觉就会越空旷、宁静、透气：

但为了方便大家理解，所以上面我举的例子都是比较极端的，毕竟非常高端的产品是少数，大多数以及大众目前能接受的都是下面这些色彩占比不那么极端的，适用于大众的的：

同时我们也要注意到一点，一个页面会体现出何种定位调性，除了色彩占比有很大的影响外，元素的形状、密度、纹理、创意风格等也会产生一些影响。

比如这三个页面，同样是黄黑搭配，但因为色彩占比不同、形式不同、风格不同，他们的调性明显是不一样的：左一简约时尚，左二搞怪活力，左三酷炫大牌。

3. 黑色电商页面的常用色彩搭配技巧

前面我们已经说了，虽然元素的形状、密度、纹理、创意风格等会对活动定位产生影响，但是决定页面是热闹促销还是高冷大牌起决定作用的其实还是黑色或暗色的占比是多少：暗色或黑色越多页面越冷酷高端，彩色越多页面就越热闹促销，而白色的占比多少则决定了你的页面透气程度，页面里白色越多越明亮，人就会感觉越空旷透气。

再一个既然是电商页面，它存在的主要目的就是卖货和展示商品用的，而这个货是要卖给不同的人群的，所以我们针对不同的人群要给他们传递的感受就会不一样，或热血沸腾，或性冷淡，或舒心，或故意让你难受，但不管怎么样，最终出来的页面情绪肯定是要传递到位的，那么一般就有下面几个规则可以注意下：

（1）黑色常作为主色或背景色

一些想走高端时尚路线以及科技大牌的页面往往比较喜欢用大面积的黑色来塑造一种距离感，也就是很多人嘴里说的“有逼格”，但这里要注意的就是，这种页面往往就会对产品的品质或光影细节有非常高的要求，因为对比太强烈的缘故，视觉太聚焦了，就像全世界的眼睛都在暗中盯着你看，你稍微有一点瑕疵都会暴露无遗；

（2）黑色常跟这些颜色走在一起

而黑色作为一种百搭色，在电商设计里最常搭配的除了白色／金色／大红色以外，还有各种荧光色，比如亮黄／亮绿／亮粉／骚紫以及五颜六色，这些颜色跟黑色搭配会形成强烈的色彩对比效果，从而突出想要表达的信息。

举例：黑白配

△  清穗

举例：黑金搭配

举例：红黑配

举例：黄黑配

举例：黑色可以包容任意的亮色

（3）有黑色的地方就该有亮色

一张有感染力的照片往往少不了光的运用，而有光的地方就会有阴影，一张打动人心的页面设计也有一样的规律在那里：页面里有暗就会有明，这样子才不会显得过于压抑，画面才更佳耐看。

举例：几乎所有的美国大片或者科技大片的海报都喜欢用这个套路

还有一些打斗类的游戏页面尤其喜欢用黑色或暗色系页面，有一些数码科技类产品的电商页面也可以试试，总之要想体现出很man的感觉，黑色或暗色是必不可少的。

4. 与黑色有关的节日或事件有哪些？

提到电商设计，当然就少不了各种电商节，其他的电商节我就不说啦，那么与“黑色”有关的能作为噱头活动去玩的节日或事件有哪些呢？

目前我所知道的，比如著名的黑色星期五、万圣节、4月14日黑色情人节、暗黑电商等。

黑色星期五，关键词：国际大牌、促销、折扣、黑色等。它是从美国漂洋过海来到中国的一种电商促销活动，几乎每个大一点的电商平台都会掺合一脚，尤其是跨进电商尤为重视：

还有很多活动页大家也可以去看看：

万圣节，关键词：南瓜、糖果、黑橙搭配、蝙蝠、幽灵、骷髅头等。它也是很多人喜爱的一种节日，商家们运营们当然也不会错过咯～

4月14日黑色情人节，关键词：男生、单身狗、促销、情人节等。发现一年貌似各种颜色的情人节一大推，无非就是找噱头做活动让你们买买买咯。

暗黑电商，其实就是指网络上的一些很隐秘的非法地下交易市场，我以前好像专门挖过这个，但是我这次就不细说了。。。被和谐了不就完蛋了～

好像有点扯远了，我们继续最后一点点内容，马上就要结束了！

至于什么纹理、构图、节奏韵律什么的，我以前的文章里都有写，你们可以看这两篇，我就不在这里赘述了：

• 六个步骤细说电商banner图设计之色彩的奥秘
• 五大步骤细说Banner图设计之平面构成的奥秘

写在最后

当别人提到“黑色”的时候，你会想到什么呢？也许你会想到黑夜、黑头发、乌鸦、神秘、阴深、距离、严肃、沉寂等等，总之他跟阳光、活力这些比较明朗的字眼时几乎挂不上钩的，这也就解释了为什么我们极少看到设计师在喜庆节日、双十一、618等页面设计里几乎看不到黑色的运用的原因。

但随着我们的购物选择越来越多样化以及人们越来越有自己的主见了的缘故，我们开始想要寻求自己的个性和高要求，我们也越来越厌倦了千篇一律，这也直接导致商家们之间的竞争开始变得越来越激烈了，也许以前你随便推出什么产品，即便是页面设计做的很丑都可以卖的很好，但现在却可能无人问津，所以商家以及设计师们都迫切的需要找到新的突破点来满足和挖掘不同客户的喜好，而对黑色的合理运用其实就是突破方式之一。

这让我想起了电影《香奈儿》的一个情节，在那个所有人都追求蕾丝、花里胡哨、雍容复杂的服装设计的年代，可可香奈尔却偏要穿简洁裁剪的男装黑色礼服等等带给人一次又一次惊喜，而她在悲痛欲绝的情况下为纪念他的情人鲍勃而设计的一条小黑裙子也成了香奈尔史上最大的成功。

△ 香奈儿片段截图

今天的文章到这里就结束了，这里是《做设计的面条》，我们下期再见！～

欢迎关注@TTTing1 的微信公众号「做设计的面条」，一个干货与文笔俱佳的美女设计师：

微信公众号简介：专注开拓电商设计思维，不定期分享一些个人见解干货，当然也会分享一些顶级创意、摄影、人生感悟方面的好文啦。

【优设网 原创文章 投稿邮箱：yuan@uisdc.com】

================明星栏目推荐================

优优教程网： UiiiUiii.com 是优设旗下优质中文教程网站，分享了大量PS、AE、AI、C4D等中文教程，为零基础设计爱好者也准备了贴心的知识树专栏。开启免费自学新篇章，按照我们的专栏一步步学习，一定可以迅速上手并制作出酷炫的视觉效果。

设计导航：国内人气最高的设计网址导航，设计师必备：http://hao.uisdc.com