颜色转换器
转换器在 HEX、RGB、HSL 颜色格式间双向换算，支持 alpha 透明通道与即时色块预览。适合设计稿取色核对、CSS 变量定义、调色板推导与可访问性对比度计算，帮助前端与视觉协同还原品牌色值，避免色差。
#667EEArgb(102, 126, 234) · hsl(229, 76%, 66%)rgb(102, 126, 234)hsl(229, 76%, 66%)关于 颜色转换器
颜色转换工具在 HEX、RGB、HSL、HSV 与 CMYK 等多种色彩空间之间实时互转，并支持透明度与常见 CSS 命名颜色。它适合前端开发取色、设计稿还原、印刷配色校准，以及按 WCAG 标准快速评估前景/背景对比度是否满足无障碍要求。转换在浏览器本地即时完成，提供可视化色块预览与一键复制，输出可直接粘贴进 CSS 变量、Sass 或设计标注，帮助设计与开发高效对齐色彩规范，避免肉眼调色的偏差，对需要兼顾多端显示一致性的设计师而言，它能把主观的“差不多”变成可度量、可复现的精确数值，减少设计稿与最终实现之间的色彩偏差，让设计意图在落地时尽量不被折损，让设计与开发说的是同一套色彩语言，减少返工与误会，本站同类工具均支持在浏览器本地离线运行，数据不会上传服务器，可放心粘贴使用。
使用方法
- 打开 颜色转换器 工具页面
- 根据需求输入或粘贴数据到输入区域
- 查看实时处理结果，使用复制按钮获取输出
使用场景
- 对齐设计稿 — 把设计师给的 HEX 转成 CSS 里要用的 rgb 或 hsl 值。
- 加透明度 — 把不透明的颜色转成 rgba，调出半透明遮罩或阴影。
- 微调色相 — 用 HSL 模式调整色相和明度，快速生成同色系的深浅变体。
- 统一变量 — 把散落的颜色统一成一种格式，方便录入设计系统的色彩变量。
- 核对预览 — 粘贴未知颜色值，实时看到色块确认是否为想要的颜色。
常见问题
支持简写 HEX 吗？
支持。三位简写如 #f00 会被识别并展开成 #ff0000，四位带透明度的简写（#f008）同样可解析。
HEX 转 HSL 会丢精度吗？
HEX 每通道只有 256 级，转成 HSL 后再转回可能有 1 个数值的舍入误差，属正常现象，肉眼通常无法分辨。
透明度怎么表示？
RGBA/HSLA 里 alpha 用 0 到 1 的小数；八位 HEX 则用最后两位十六进制表示透明度，工具会自动对应换算。
支持 CSS 颜色名吗？
常见的命名颜色（如 red、rebeccapurple）通常可作为输入识别，输出则以数值格式为主，便于精确使用。
想做纯数字进制换算怎么办？
本工具专注颜色格式；若只是想把十六进制数转十进制等纯数字换算，请用本站的进制转换工具。
有浏览器兼容性要求吗？
本工具兼容所有现代浏览器（Chrome、Firefox、Edge、Safari），无需安装任何插件或扩展。
可以离线使用吗？
首次加载后，部分功能在离线状态下仍可使用。页面资源加载后，核心逻辑完全在浏览器本地运行，不依赖网络。
评论与讨论
评论仅保存在你的浏览器本地，切换设备后不可见。配置 Giscus 后可支持云端评论。