库里的多巴胺配色
卡片标了主色与饱和度。这一类比的是「跳不跳」,所以饱和度比色号更值得看。
#964def饱和 84%14.76:1 · AAA#313ded饱和 84%14.72:1 · AAA#2563eb饱和 83%17.85:1 · AAA#4c8df6饱和 90%15.29:1 · AAA#f02b45饱和 87%15.06:1 · AAA#1989ea饱和 83%14.54:1 · AAA#e23c16饱和 82%14.72:1 · AAA#f221e7饱和 89%14.63:1 · AAA#e6148a饱和 84%14.66:1 · AAA#e61e14饱和 84%14.70:1 · AAA#e05c86饱和 68%14.69:1 · AAA#7c5ce0饱和 68%15.38:1 · AAA#e0551a饱和 79%15.51:1 · AAA#1710dd饱和 87%15.42:1 · AAA#4376db饱和 68%14.68:1 · AAA#db43a1饱和 68%14.66:1 · AAA#dd762b饱和 72%14.43:1 · AAA#1e6fd9饱和 76%15.28:1 · AAA#d96a24饱和 72%15.08:1 · AAA#a78bfa饱和 92%16.19:1 · AAA#ac1dc9饱和 75%15.00:1 · AAA#8028d2饱和 68%14.76:1 · AAA#d2285c饱和 68%14.69:1 · AAA#4a27cb饱和 68%15.34:1 · AAA#c1272d饱和 66%17.80:1 · AAA多巴胺配色到底是什么
它借的是神经递质的名字,指的是让人一眼觉得开心的配色:高饱和、高明度、色相之间距离大。真正起作用的不是某一个颜色,而是纯度与并置。
所以多巴胺可以是蓝、是粉、是黄,也可以几个一起上。判断标准只有一条:放到屏幕上,第一秒是否让人觉得亮。
三条使用规则
一、底色必须留白
高饱和最怕铺满。这 25 套几乎都是白底或极浅底配高饱和主色,正文对比度最低 14.43:1、最高 17.85:1 也是这么来的。高饱和做整页背景,文字会先糊。
二、一次最多两个高饱和
三个高饱和色并列,眼睛找不到落点。正确做法是一个主色加一个辅助色,其余退回中性色或同色的浅阶。
三、文字不要用高饱和色
高饱和色的明度普遍在中间,压在白底上对比度不够。正文与标题一律用深中性色,饱和色只做点缀与大色块。
多巴胺和高对比不是一回事
高对比说的是明暗差(黑白、深蓝配白),多巴胺说的是纯度差。库里同时符合「高对比」标签的有 6 套,这个数字说明两个词指向的其实不是同一批配色:高对比可以完全不带色相,多巴胺没有色相就立不住。
什么时候别用多巴胺
- 需要长时间停留或专注的界面:后台、编辑器、数据看板。高饱和会持续抢注意力,看久了累。
- 需要专业与稳重的场景:金融、医疗、法务。高饱和会削弱可信感,这是行业惯例而不是偏见。
- 以色盲用户为主要受众的产品。高饱和不等于高可辨,红绿与蓝紫的区分要先跑一遍模拟器。
常见问题
- 多巴胺配色一定要很多颜色吗?
- 不用。一套里两个高饱和色就够,再多会互相抵消。关键在于饱和度与明度,不在数量。
- 为什么库里的多巴胺主色大多是蓝紫?
- 因为蓝紫压深之后仍能保持高饱和,而黄与橙压深就会变土。想要暖色多巴胺,就要接受更低的文字对比度。
- 多巴胺适合做深色模式吗?
- 适合,但要重算:深底会把高饱和色的观感压暗,主色往往要提亮一到两档。用深色模式转换器跑一遍看实测值。