颜色代码转换器
颜色代码转换器是一个免费的在线工具，可以即时在网页设计和开发中使用的不同颜色格式之间进行转换。一键转换 HEX（#RRGGBB）、RGB（rgb(r,g,b)）、RGBA（rgba(r,g,b,a)）、HSL（hsl(h,s%,l%)）、HSLA 和 CSS 命名颜色。输入任意格式的颜色，即时获取所有其他表示形式。非常适合需要在 CSS、JavaScript、设计工具和图像编辑器之间转换颜色值的开发者，以及想将拾色器输出转换为 CSS 兼容格式的设计师。
功能介绍
颜色代码转换器在数字设计和网页开发中使用的各种颜色格式之间进行转换。不同的工具和场景使用不同的颜色表示法，这个转换器在它们之间架起桥梁。 支持的颜色格式： - HEX（#RRGGBB 或 #RRGGBBAA）：最常见的网页颜色格式——一个代表红、绿、蓝通道的六位十六进制字符串。示例：#FF6347（番茄红） - RGB（rgb(255, 99, 71)）：指定红、绿、蓝值（0-255）的功能表示法。 - RGBA（rgba(255, 99, 71, 0.8)）：带 Alpha 通道（透明度，0.0-1.0）的 RGB。 - HSL（hsl(9, 100%, 64%)）：色相（0-360度）、饱和度（0-100%）、亮度（0-100%）。更直观，便于人类理解颜色。 - HSLA（hsla(9, 100%, 64%, 0.8)）：带 Alpha 通道的 HSL。 - CSS 命名颜色：148 个标准名称，如 'tomato'、'cornflowerblue'、'rebeccapurple'。 - HSVA、CMYK（面向设计的转换） 为什么存在多种颜色格式： - HEX 紧凑且在 HTML/CSS 中普遍支持 - RGB 匹配屏幕产生颜色的方式（红光+绿光+蓝光） - HSL 直观：调整亮度而不改变核心色相 - RGBA/HSLA 添加透明度控制 - 设计工具（Figma、Sketch）通常使用与代码要求不同的格式 转换准确性： 所有转换使用 CSS Color Module Level 4 规范中的精确数学公式。HSL↔RGB↔HEX 转换对 8 位颜色通道是无损的。Alpha 通道值被精确保留。
使用方法
- 在输入字段中输入任意支持格式的颜色值。可以输入十六进制代码（#FF6347）、RGB 值（rgb(255,99,71)）、HSL 值（hsl(9,100%,64%)）甚至 CSS 命名颜色（tomato）。
- 工具自动检测你输入的格式，并实时显示所有其他表示形式。无需点击转换按钮——输入时即时更新。
- 在输出面板中查看转换结果。每个面板显示格式名称、语法和格式化值。点击任何结果即可立即复制到剪贴板。
- 使用颜色选择器（吸管图标）从屏幕上直观选择颜色。所选颜色立即转换为所有支持的格式。
- 查看颜色预览色块以确认实际颜色。预览在浅色和深色背景上显示颜色以帮助你评估可见性。
- 对于 rgba/hsla 转换，调整不透明度滑块查看透明度变化如何影响输出十六进制代码（8 位格式）和其他表示形式。
计算示例
输入: HEX: #FF5733
过程: FF=255, 57=87, 33=51
结果: RGB(255, 87, 51) | HSL(11, 100%, 60%)
输入: RGB(0, 128, 255)
过程: 0=00, 128=80, 255=FF | H=210, S=100%, L=50%
结果: HEX: #0080FF | HSL(210, 100%, 50%)
相关搜索
相关搜索：颜色代码转换器, hex 转 rgb, rgb 转 hsl, 颜色转换。
颜色代码转换器hex 转 rgbrgb 转 hsl颜色转换
常见问题
HEX 和 RGB 格式有什么区别？
HEX（#FF6347）和 RGB（rgb(255, 99, 71)）表示相同的颜色但使用不同的表示法。HEX 将所有三个颜色通道组合成一个十六进制数（16进制）。RGB 将每个通道单独表示为 0-255 的十进制数。HEX 更紧凑，是大多数设计工具和 HTML 中的默认格式。RGB/HSL 功能表示法更具可读性，在 JavaScript 中更容易操作（如在 HSL 中调整亮度）。
我的 CSS 应该用 HSL 还是 RGB？
HSL 通常更适合程序化颜色操作，因为它更直观。使用 HSL，你可以通过降低亮度百分比来加深颜色，或通过改变色相来调整颜色——而不影响其他方面。使用 RGB，创建较深的色调需要按比例减少所有三个通道，这更难理解。然而，HEX 仍然是样式表中静态颜色值最紧凑的格式。
可以转换 8 位十六进制颜色（带透明度）为其他格式吗？
可以。8 位十六进制代码（#RRGGBBAA）包含 Alpha 通道。例如，#FF634780 表示 50% 透明度的番茄红。工具将其转换为 rgba() 表示法。从 rgba() 转换为十六进制时，如果 alpha 小于 1.0，输出将是 8 位十六进制格式。你也可以使用不透明度滑块实时调整透明度。
如何将 CMYK 转换为 RGB 用于网页？
CMYK（青色、品红色、黄色、黑色）用于印刷设计。要将 CMYK 转换为 RGB 用于网页/CSS，使用 CMYK 输入字段（每个通道值 0-100），工具输出等效的 RGB、HEX 和 HSL 值。注意：CMYK 和 RGB 有不同的色域——一些印刷颜色没有完全对应的屏幕颜色。转换提供最接近的 RGB 近似值。
工具支持 LCH 或 LAB 等 CSS4 颜色格式吗？
工具支持最常用的格式（HEX、RGB、RGBA、HSL、HSLA、命名颜色）。CSS Color Module Level 4 引入了 LCH、LAB 和 OKLCH，提供更感知均匀的颜色空间。对于大多数网页开发需求，HSL 提供了足够的感知均匀性。如果你特别需要 LCH/LAB 转换，专业的色彩科学工具可能更合适。