如何把 HEX 颜色转换成 RGB 或 HSL？
在 DevTools 颜色代码转换页面输入 `#0EA5E9`、`#0af` 或不带井号的十六进制值，工具会立即输出对应的 RGB 和 HSL 表示。
颜色代码转换
DevTools 颜色代码转换器可在浏览器本地把 HEX、RGB 与 HSL 颜色值互相转换，支持 3 位 HEX 简写展开、实时颜色预览和一键复制，无需注册。
颜色代码转换
在 HEX、RGB 与 HSL 之间双向转换颜色值，支持实时预览、简写 HEX 展开与复制输出。
颜色样本
输入任意一种格式后，其余格式会自动同步。
当前预览使用最近一次有效颜色值。
- R / G / B
- 14 / 165 / 233
- Hue
- 199deg
- S / L
- 89% / 48%
HEX 支持 #0af、0af、#00AAFF 这类写法；RGB 可输入 rgb(14, 165, 233) 或 14, 165, 233；HSL 可输入 hsl(199, 89%, 48%) 或 199, 89%, 48%。
工具介绍
这个工具适合前端开发、设计交接和主题色调试。输入 HEX、RGB 或 HSL 任意一种格式后，其余两种表示会自动同步，并保留最近一次有效颜色作为预览。
使用说明
- 在 HEX、RGB 或 HSL 任意一个输入框中输入颜色值。
- 查看颜色方块、主预览面板以及自动同步的其余格式输出。
- 点击复制按钮，将 HEX、RGB 或 HSL 结果用于 CSS、设计稿或代码配置。
常见问题
颜色代码转换支持简写 HEX 吗？
支持。像 `#0af` 这样的 3 位简写会自动展开成标准 6 位 HEX，并同步更新 RGB 与 HSL 结果。
RGB 和 HSL 输入也能反向同步吗？
可以。输入 `rgb(14, 165, 233)`、`14, 165, 233`、`hsl(199, 89%, 48%)` 或类似格式后，页面会反向生成标准 HEX 与另外一种颜色表示。