颜色色值转换器

关于 颜色色值转换器

颜色色值转换器支持 HEX（十六进制）、RGB、RGBA、HSL 四种格式的实时互相转换，并内置浏览器原生取色器，点击预览区域即可选择任意颜色。内置 12 色常用预设色板，所有格式均支持一键复制，适合前端开发和 UI 设计配色使用。

使用步骤

1. 点击顶部颜色预览区域，打开系统取色器，选取任意颜色后自动填充 HEX 与 RGB 值。
2. 也可在 "HEX 色值" 输入框直接粘贴十六进制色值（如 #1677ff 或 1677ff），RGB 字段会同步更新。
3. 或直接修改 R / G / B 输入框（0-255），HEX 色值会实时同步。
4. 预设色板中点击任意小方块，可快速切换到该颜色。
5. 下方展示 HEX、RGB、RGBA、HSL、CSS 变量五种格式，点击对应行的"复制"按钮即可粘贴使用。

常见使用场景

• 从设计稿获取颜色后转换为 CSS 可用的 HEX 或 RGB 格式
• 将品牌主色 HEX 转为 RGBA 以在 CSS 中设置透明度
• 开发 Tailwind / MUI 主题时快速验证颜色色值
• 验证前景色和背景色之间的视觉对比度