从找灵感、定色板,到交付能直接用的色值
配色工具其实不是一类东西。有的帮你找感觉(现成色板),有的帮你生成(算法配平),有的帮你把颜色落到代码里(导出变量、对比度校验)。混着用就会出现「看着好看但用不了」的色板。这篇按阶段拆开。
生成类里最顺手的一个:锁定 + 快捷键 + 导出全
Coolors 的核心体验是快:空格键换一组配色,锁定满意的色再继续换其他位,最后导出为 HEX、RGB、CSS、SVG、PNG 或链接。「锁定 + 随机」这个交互是它真正的价值——它让你在几秒内得到几十个候选,而不是从一个空色盘开始想。
要注意生成结果偏现代、饱和度较高,做传统、雅致、低饱和方向的项目要手动压。部分功能(保存调色板、团队协作)需要账号。
不想自己调,直接拿现成的四色板
Color Hunt 是人肉筛选的配色板集合,每套四色,以卡片形式展示。它的价值在于「已经被人选过一遍」——不用自己判断这组颜色能不能用,直接挑顺眼的拿走。
要注意只有四色,做完整设计系统不够用,需要自己扩展中性色与语义色。色板偏流行风格,时效性强。
需要从色彩理论出发调色时的标准工具
Adobe Color 以色轮为基础,可以按互补、类似、三角等配色规则生成,也能提取图片配色。它还有可访问性工具,能直接检查文字与背景的对比度是否达标。要跟甲方解释「为什么这几个颜色搭」,用它出图最有说服力。
要注意免费账号有保存数量限制。界面偏重,快速取色的场景不如 Coolors 利索。
中文项目的文化底色:把传统色名对应到色值
中国传统颜色,把「胭脂」「天青」「月白」这类传统色名对应到具体色值。它解决的是中文语境里最难传达的一件事:把「青」这种模糊的说法变成十六进制。做国风、文创、茶酒食品牌时比通用配色工具贴得多。
要注意它提供的是颜色参考与文化背景,不是配色方案,不会告诉你哪几个搭在一起好看。
做复古、年代感项目时最有用
Color Leap 按年代整理历史配色(从古埃及到六十年代),每套都配了当时的设计作品与背景说明。做复古风、怀旧主题、年代叙事的内容时,它给的不只是色值,还有依据。
要注意配色偏时代风格,现代界面直接用会显得陈旧。适合当灵感与依据,不适合当生产色板。
需要渐变时,别自己拖,直接拿现成的
WebGradients 收录上百种线性渐变,每个都能一键复制 CSS 代码,也能下载成 PNG、Sketch 或 PSD 文件。渐变的难点在于「两个颜色之间过渡会不会发脏」,现成的方案已经被人筛过一遍了。
要注意渐变风格偏网页背景类,做品牌主视觉可能不够精细。颜色不能改,想要微调得自己拿代码改。
要改渐变角度与色标时用它
Grabient 能可视化调整渐变的角度、色标位置与颜色,实时看到结果并复制 CSS。需要把一个大致方向调成精确值的时候,它比在代码里改十六进制快得多。
要注意功能集中在渐变这一件事上,不提供配色方案。
做竞品分析、品牌致敬时查色值用
BrandColors 收录各大品牌的官方色值与色板,能直接复制 HEX,也有下载包。做品牌对标、竞品视觉分析、或者需要「看起来像那个层次」的配色时,它是数据源。
要注意色值不授予商标使用权。参考配色方向没问题,直接拿别人的品牌色做主色就是另一回事了。
一站式:生成色板 + 检查对比度 + 导出
Colorkit 提供色板生成、色阶扩展、对比度检查与导出,把几个常用动作收在一个页面里。适合不想在四五个工具之间来回跳的时候。
要注意每个单项功能都不是最强的,胜在集成。深度使用仍会回到专项工具。