摘要：免费的颜色转换工具，支持 HEX/RGB/HSL 互转及 Alpha 透明度，前端开发必备，本地运行。
本地工具可在 DevTools → Network 搜索输入内容，通常不会出现在请求中。
使用指南
同一个颜色在不同场景要用不同写法：CSS 里 HEX/RGB/HSL（含 alpha）、印刷品 CMYK、设计工具 HSV。本工具接受短 HEX、4/6/8 位 HEX、rgb()/rgba()/hsl()/hsla()，保留透明度并展开经典与现代语法，附带 R/G/B/A 分解、对白/黑底对比度速览、Tailwind 最近色、色阶与 WCAG 检查。
1. 转换与取用
- 输入 #fff / #ff000080 / rgba(255,0,0,0.5) / hsl(217 91% 53% / 0.8)，或用取色器；HEX、HEX8、RGB、RGBA、现代 rgb()/hsl()、HSL、HSLA、HSV、CMYK 即时展开。
- 复制需要的格式——不透明 CSS 用 HEX/RGB，半透明用 HEX8/RGBA/HSLA 或现代空格语法；预览下方有 R·G·B·A 分解。
- 设计需求用「色阶生成」从品牌色派生 50–900；对比度区核 WCAG AA/AAA；预览旁有对白底/黑底的比率速览。
2. 输入与输出边界
RGB 说的是「多少红绿蓝光」，HSL 更贴近「色相、更浅、更饱和」。转换工具把输入坐标翻译成你能「想」的格式，并把透明度一并带上。
- 输入支持 #RGB/#RGBA/#RRGGBB/#RRGGBBAA、rgb()/rgba()、hsl()/hsla()（逗号或空格语法）；alpha 会保留并出现在 HEX8/RGBA/HSLA 与现代语法输出中。
- 常见 CSS 色（含命名色、部分现代色彩空间）可解析进入；色阶与 Tailwind 匹配仍基于不透明 sRGB 通道。
- 非法 HEX 位数（非 3/4/6/8）或未闭合的颜色函数会给出针对性提示，而非笼统「无效」。CMYK 为无 ICC 近似；Tailwind 按 RGB 欧氏距离取最近色。
3. 两个高频坑
- 屏幕颜色 ≠ 印刷颜色：HEX 是屏幕的 sRGB，CMYK 转换只是近似——印刷品务必以印刷色卡为准，工具给出的 CMYK 仅作参考。
- 文字对比度要按 WCAG 查：正文对背景至少 4.5:1（AA），大字 3:1。用工具里的对比度检查替代肉眼「看着清楚」，尤其是灰色文字配白底；半透明色还需考虑叠在真实背景上的有效对比度。
4. 设计稿到代码的常见路径
设计工具常给 HEX 或带 alpha 的 RGBA；落地 CSS 时，不透明色用 HEX/RGB 最省事，半透明交互态（hover 遮罩、标签底色）更适合 RGBA/HSLA 或现代空格语法。需要与 Tailwind 主题对齐时，用「最近色」看距离——距离大说明该色不在默认色板里，应写入自定义 theme 而不是硬凑最近的 utility class。
5. 色阶与单一品牌色
- 色阶生成按明度梯度派生 50–900，适合做按钮、hover、浅底、边框一整组；它不是「和谐配色规则」（那是调色板生成器的工作）。
- 换品牌色时，应整组替换 CSS 变量或主题配置，避免页面各处散落硬编码 HEX。
- 浅色阶做正文背景时，务必再跑一遍对比度——好看的 100 色阶配灰字经常达不到 AA。
6. 和站内相关工具怎么串
单色格式、对比度、最近 Tailwind、色阶——本页一次做完。要从一张图抽主色，用图片取色；要按和谐规则生成整套辅色，用调色板生成器；要专门做无障碍对比矩阵，用对比度检查器。路径是「取色 → 转换/色阶 → 对比度验收」，而不是在一个页面里塞进所有设计系统能力。半透明色复制时留意你贴进的上下文是否支持 alpha：老旧邮件客户端或部分导出链路只认六位 HEX，这时要用不透明近似色或改写为叠加后的实色。取色器适合从屏幕抓现成色；从设计标注抄 HEX 时注意是否已含 alpha（8 位 HEX）——漏掉两位会得到完全不透明的「同色相」错觉。
常见问题
HEX（3/4/6/8 位）、RGB、RGBA、HSL、HSLA、HSV、CMYK，以及现代空格语法（如 rgb(r g b / a)）。输入任意一种常见写法即可展开其余格式并显示 R/G/B/A 分解，半透明色可复制带 alpha 的写法。
不能。工具给出的 CMYK 是无 ICC 的近似，只作屏幕侧参考——HEX 属于屏幕的 sRGB，和油墨呈色本就不是一套体系。印刷请以实物色卡或印刷流程为准。
对比度区按 WCAG 核阈值：正文至少 4.5:1（AA），大字 3:1，用它替代肉眼「看着清楚」；最近色按 RGB 欧氏距离提示最接近的 Tailwind 色，距离大说明该色不在默认色板，应写入自定义主题而不是硬凑 utility class。
从品牌色按明度梯度派生 50–900 一整组，适合按钮、hover、浅底、边框成套取色。它不是和谐配色规则（那是调色板生成器的职责）；浅色阶配灰字做正文背景时经常达不到 AA，落地前再跑一遍对比度。
从设计标注抄 HEX 时先确认是不是 8 位（含 alpha）——漏看两位会得到完全不透明的「同色相」错觉。另外老旧邮件客户端和部分导出链路只认 6 位 HEX，此时要改用不透明近似色，或先叠加成实色再取值。
都不。转换在浏览器内即时完成，免费、无注册、无次数限制，也不会存储或上传你输入的任何颜色值。