做配色时最怕两件事:一是灵感来得快、落到可复用的调色板却很慢;二是方案看着高级,上线后却因为对比度/色域/显示差异翻车。下面这份清单把常用的配色灵感、调色板生成、无障碍对比度检查和显示校色工具放在一起,方便按场景快速选型。
需看协议:Adobe 官方配色与主题探索工具,可基于色轮规则生成方案,并浏览社区主题做灵感采样。
工具地址:https://coolors.co/
需看协议:一键生成并锁定颜色的调色板生成器,适合快速迭代多套方案并导出到多种格式。
需看协议:偏灵感浏览型的配色库,适合在早期定风格时快速“扫一遍”热门组合。
免费商用:基于色轮与互补/三分/四分等规则的经典配色工具,能直观看到色相关系并快速得到多级色阶。
工具地址:https://www.happyhues.co/
需看协议:将配色直接落到界面组件示例里,能更快判断“这套颜色在真实 UI 里是否好用”。
工具地址:https://khroma.co/
需看协议:用偏好训练生成你“更可能喜欢”的配色组合,适合做探索与灵感扩展。
工具地址:https://material-foundation.github.io/material-theme-builder/
需看协议:面向设计系统的主题生成与预览工具,可从主色推导语义色与状态色,并预览组件效果。
工具地址:https://webaim.org/resources/contrastchecker/
免费商用:输入前景/背景色即可得到 WCAG 对比度结果,适合在定稿前快速做可读性底线检查。
需看协议:在设计工具内完成对比度检查与无障碍相关提示,减少“做完再返工”的概率。
免费商用:色觉缺陷模拟工具,可在桌面端模拟不同色觉情况,帮助检查信息是否过度依赖颜色传达。
需看协议:用于显示校色与 ICC 配置文件管理的工具,适合对色彩一致性要求更高的场景(摄影/印刷/高端品牌视觉)。
工具地址:https://accessible-colors.com/
免费商用:在满足对比度的前提下调整颜色,帮助你在“审美”和“可读性”之间更快找到平衡点。