颜色转换工具怎么用？
粘贴 HEX、RGB 或 HSL 颜色值，点击转换即可得到另外几种常用 CSS 写法。结果可以直接复制到样式表、组件变量或设计标注中。
常见使用场景
前端开发中经常需要把设计稿里的 HEX 转成 RGB，或者把主题色转换成 HSL 以便调整亮度和饱和度。本工具适合快速校验颜色值是否正确。
HEX、RGB 和 HSL 有什么区别？
HEX 更紧凑，适合 CSS 和设计标注；RGB 直接描述红绿蓝通道；HSL 按色相、饱和度、亮度表达颜色，更适合做主题色扩展。
Color Converter
颜色转换工具
输入 HEX、RGB 或 HSL 颜色值，快速得到常用 CSS 颜色格式，适合样式调试、设计稿标注和主题色整理。
HEXRGBHSL颜色预览
Convert
转换颜色
支持 #RGB、#RRGGBB、rgb(...)、hsl(...) 格式。
热门颜色转换需求
HEX转RGBRGB转HEXRGB转HSLHSL转RGBCSS颜色颜色预览
常用 CSS 格式互转
一次得到 HEX、RGB 和 HSL 写法，避免手动换算通道值或重复查表，适合前端样式调试和设计交接。
调整主题色更直观
HSL 通过色相、饱和度和亮度描述颜色，制作 hover、禁用态和深浅主题时更便于保持色彩关系。
浏览器本地转换
颜色输入仅在当前页面解析，不上传设计色板或项目中的样式值。
热门颜色转换需求
颜色转换工具HEX转RGBRGB转HEXHSL转RGBCSS颜色值在线颜色转换主题色转换颜色代码查询
工具指南
颜色转换是什么？
在 HEX、RGB 和 HSL 等常见颜色格式之间转换。
颜色转换HEX 转 RGBHSL 转换CSS 颜色
如何使用颜色转换
- 输入 HEX、RGB 或 HSL 颜色值。
- 转换为其他常见格式。
- 复制 CSS 或设计标注需要的颜色值。
功能特点
- 免费使用
- 无需注册
- 支持现代浏览器
- 流程清晰，结果可复制
常见问题
关于颜色转换工具
支持简写的 HEX 颜色吗？
支持。#0f7 会被自动展开为 #00ff77，再同步输出对应的 RGB 和 HSL 值。
可以直接输入 rgba 或 hsla 吗？
当前工具聚焦不含透明度的 HEX、RGB 和 HSL 颜色值。需要透明度时，请在转换结果基础上按项目规则补充 alpha 通道。
颜色转换会保留输入记录吗？
不会。转换在浏览器本地完成，刷新或关闭页面后不会保留输入内容。