如何制定产品主色？试试超容易上手的色彩理论取色法。

从零做一款产品的时候，需要制定产品的主色。怎么制定呢？

"归纳产品特性和理念-提取关键词-建立情绪版-选择色相-制定色系"，这是很多文章里面归纳出来的几步，使用的时候也有理论依据。但我想说点不一样的。在这个时代，产品五花八门，想用哪一类别的产品一搜一大把，在七麦数据搜索购物类的
APP 榜单，光第一页单榜就有 200 多个。

我们模糊一下这张图，你会发现 APP 最终记忆点是色彩。

换做在手机看也是一样的，打开你的 APP 列表，快速往下滑去找一个
APP，你会发现它们最终只剩下色彩——"我想找爱奇艺，它在我记忆中是绿色的，刚才快速滑过的红色黄色都不是"。当然，这只是拿来举例，通常你不需要这样去找一个APP。用这个例子只想强调APP主色的意义——它是区别于竞品的第一特征，是调性概括，是一种态度，甚至是你趁手的兵器。

所以当你去确定产品主色的时候，有三种思路：随大众；反着来；搞特殊。

随大众

不同的行业发展至今，已经自带色相了。比如电商购物是红黄色、医疗健康是蓝绿色、商务是蓝色…如果我们每次都用产品或者行业特性去推导色相，出来的大多数都是第一种思路。

反着来

使用和竞品色相相差大于 90 度（中差色、对比色、互补色）的，差别较大的就是反着来。这是逆向思维，通过差异较大的色相能让你在一堆颜色同质化的竞品中跳出来。

搞特殊

抖音和 keep 是我心中搞特殊的 top，既不使用行业相同的色相，也不使用相反的色相，而是双色相或双色相叠加。

用我做的小易 APP 来做例子说一下制定色系的过程吧

基于行业与场景确认色相
色相偏移
WCAG 标准验证颜色
色系拓展

基于行业与场景确认色相

小易是一款助力销售的 CRM
产品，主打销售智能化。取色就要看你立足点是"数据智能"还是"销售"了。与数据智能相关的绕不开蓝绿色，与销售系统相关的绕不开橙色。这个产品是内部定制化的，不存在有竞品的情况，因此随大众更容易取得方案的通过。为免出现"这个颜色一点都不科技和智能"的质疑和返工，我非常科学（识相）地选择了蓝色作为主要色相。

色相偏移

用 HSB 参数来看，正蓝色的 H 值（色相）是 240。引用优设大课堂态爷的一句话是：要想颜色好看，色相别太正。那么正蓝色就要偏移：往冷色偏移或者往暖色偏移。

这里加入一个空间的概念：假设产品是一个空间，里面主打智能和数据，我设定了大环境偏冷光，所以里面的物体会受冷光的影响。

在冷光环境下，蓝色的色相受环境影响，会往冷色偏移。色相偏移 15 度是同类色，偏移 45 度是近似色。我在两者之间取了中间值，约 25
度。对市面上的产品取色进行研究的时候，会发现它们的色值一般在拾色器九宫格的右上格，所以 S 值（饱和度）的取值范围大致在
77%-100%之间，我取了中间偏下的值 89%。B 值（明度）一般为 100%，除了黄绿色相本身明度偏高，则会适当降低明度。

WCAG 标准验证颜色

WCAG 是网页无障碍指南其中关于颜色的使用标准，简单来说就是色彩要在页面中达到一定的对比度，才能让人看清。WCAG
用色标准中普通文本与背景对比度不低于 4.5：1，那么对于高亮文字颜色（通常是产品主色）是不是也需要达到这个标准呢。我用几个 APP
进行了测试，下列 APP 的对比度在白色页面中范围是 2.3-4.5。