调色不再靠猜：设计师和前端都该收藏的颜色工具

配色是设计和前端绕不开的一环：页面文字看不清、品牌色要延伸出同系深浅、不同格式的颜色值要互转……一组纯前端颜色工具能把这些事变简单，打开网页就能用。

一、取色：屏幕上的颜色一抓即得

看到喜欢的配色想复刻？屏幕取色器把鼠标所指的像素颜色抓出来，给出十六进制等数值，做素材采集很方便。如果只想快速选个颜色，颜色选择器 提供可视化的色板与数值输入，比在代码里盲调高效。

二、对比度：可读性的一道底线

浅灰字配白底、深蓝配黑，看起来"高级"却可能不符合可读性甚至无障碍规范。颜色对比度 校验前景与背景的对比比值，对照 WCAG 标准判断能否过关，做网页、PPT 时尤其该查一下。

三、转换与衍生：把一种颜色玩出花

设计稿用 HEX、CSS 里写 RGB、印刷要 CMYK，格式来回转很烦。颜色格式转换 支持 HEX/RGB/HSL 等互转，省去手算。想给主色配一套梯度？色阶生成器 基于一个基准色自动产出由浅到深的序列，做按钮 hover、图表分区都顺手。再进一步，调色板生成器 能根据一个种子色给出协调的配色方案，灵感卡壳时很好用。

小结

好的配色一半靠审美、一半靠工具。把取色、对比度、转换、衍生这几步的工具备齐，配色效率能明显上一个台阶。