做一套“看起来舒服、用起来清晰”的配色，往往要同时解决三件事：找到可用的主色与辅助色、控制层级与对比度、并在落地前做无障碍与色盲场景的检查。下面这份清单把常用的在线工具按工作流串起来：先生成与探索调色板，再把颜色转成可复用的 Token/变量，最后用对比度与色觉模拟工具做一次快速验收。每个工具都给出入口地址与适用场景，方便你按需选用。
工具地址：https://coolors.co
免费商用
一键生成与锁定色板，支持快捷键迭代、导出 ASE/PNG、提取图片配色，适合做 UI 主题色与插画配色的第一步。建议先用它确定 1 个主色 + 1 个强调色，再围绕主色扩展中性色。
需看协议
基于色相环规则（互补、三分、类似等）探索方案，并提供社区方案库。适合在品牌色既定时，快速找到“成体系”的辅助色与分层用色。
工具地址：https://colorhunt.co
需看协议
大量四配色方案按热门/最新分类浏览，适合在缺乏灵感时做参考与方向对齐。建议把喜欢的方案先做成设计系统的候选主题，再进入对比度校验环节。
工具地址：https://huemint.com
需看协议
用模型对不同场景（UI、插画、海报等）给出配色建议，并能看到在组件上的预览效果。适合在“想要某种氛围但说不清颜色”时，用多轮生成收敛到可落地的方案。
工具地址：https://colormind.io
需看协议
可以锁定其中几种颜色，让工具补齐其余颜色，适合从已有品牌色/插画主色出发扩展一套完整 UI 色板。生成后建议补充中性色与状态色，避免直接拿来就用。
工具地址：https://paletton.com
需看协议
更偏“传统配色学”的工具，适合需要可解释的色相规则时使用。它在教育与快速推演上很强：你能直观看到同一规则下不同饱和度/亮度组合带来的氛围变化。
需看协议
把单色扩展成渐变、色阶与配色建议，适合做背景渐变、图表连续色带以及 Skeleton/Disabled 这类灰阶层级。使用时建议用对比度工具验证文字落在渐变上的最差位置。
需看协议
更偏“设计系统”思路：从基色生成一套可用的色阶，并结合对比度来建议可用的前景/背景组合。适合要做 Token 化的品牌色与状态色体系。
工具地址：https://accessible-colors.com
需看协议
输入前景/背景后直接给出 WCAG 通过情况，并能建议“更接近但可通过”的替代色。适合在视觉稿已定、但对比度差一点点的情况下快速修正，而不是大改整体风格。
工具地址：https://webaim.org/resources/contrastchecker/
免费商用
最常用的对比度校验入口之一，给出 AA/AAA 的通过与否。建议把常用字号（正文、按钮、注释、标签）都测一遍，别只测一个 16px 的样例。
需看协议
不仅给对比度结论，还能用不同视觉能力分布做预览，帮助你理解“为什么这个组合对一部分人几乎不可读”。适合做团队共识与设计评审时的说明材料。
需看协议
提供对比度、色盲模拟等能力（常见于设计工具插件/工作台形态）。如果你的团队在 Figma/Sketch 等工具内工作，Stark 这种“在设计环境里直接检查”的方式通常更省时间。
免费商用
偏“全局模拟”的思路：把屏幕呈现整体切换到不同色觉模式，快速发现图表、状态色、提示色在色盲场景下是否会混淆。建议重点检查：成功/警告/错误三色是否仍可区分。
工具地址：https://oklch.com
需看协议
当你需要“保持明度一致但调整色相/饱和度”时，OkLCH 这类工具更直观。适合做图表多分类颜色、或者做同一品牌色的不同亮度层级，避免某些颜色天然看起来更“脏/灰”。
小建议：配色不是越多越好。先确定可用的主色与中性色，再把状态色限制在少量、可解释的集合里；最后用对比度与色盲模拟做一次验收，把“看起来不错”变成“任何人都能读懂”。
