HEX 转 RGB 转换器
将 HEX 颜色转换为 RGB 和 HSL,并提供实时预览。
如何使用 HEX 转 RGB 转换器
- 输入一个十六进制颜色值,例如 #137256。
- 复制你需要的 RGB 或 HSL 值。
关于 HEX 转 RGB 转换器
HEX 和 RGB 是同一种颜色的两种写法。RGB 为每个通道——红、绿、蓝——赋予一个 0 到 255 之间的值;HEX 则用十六进制把这些相同的数字写出来,每个通道两位数字。这就是为什么 #137256 和 rgb(19, 114, 86) 是完全相同的颜色:十六进制 13 就是 19,72 就是 114,56 就是 86。简写形式 #abc 只是把每位数字重复一遍得到的 #aabbcc。两者都是加色模式——描述的是屏幕发出的光,这与 CMYK 油墨印刷正好相反,后者每添加一种颜料就会从纸面上减去一部分光。
HSL 才是真正值得理解的表示法。它把同一种颜色重新表述为色相(色轮上的一个角度)、饱和度和明度,让这些数字都具有实际意义。想做一个悬停态?把明度调低,色相保持不变即可。要搭建一套配色方案?保持色相不变,调整饱和度和明度——或者交给 色阶生成器来完成。而在 RGB 中,你相当于同时在猜三个相互关联的数字。这才是设计师要做转换的真正原因。
粘贴一个十六进制颜色值——# 可有可无,三位或六位数字均可——即可在你输入时实时获得 HEX、RGB 和 HSL 值以及一个实时色块。它也能识别 rgb(),并接受 rgba(),但会舍弃透明度。八位十六进制和颜色命名不会被解析。一切都在你的浏览器本地运行。用 对比度检测工具检查可读性。
常见问题
支持 3 位十六进制吗?
支持。像 #abc 这样的短十六进制会通过重复每位数字扩展为 #aabbcc,而 # 本身也是可选的。
为什么 #137256 和 rgb(19, 114, 86) 是同一种颜色?
因为十六进制只是以 16 为基数的表示方式。每两位十六进制数字对应一个通道:十六进制的 13 就是十进制的 19,72 是 114,56 是 86。同一种颜色,不同的记法而已。
什么是 HSL,我为什么要用它?
色相、饱和度和明度。它把"是什么颜色"与"有多鲜艳、有多明亮"区分开来,因此你只需微调一个数字,就能得到一个色调、一个明暗变化或一个悬停态,而不用猜测三个全新的 RGB 数值。
我可以输入带透明度的颜色吗?
你可以粘贴一个 rgba() 值,但透明度会被忽略——只有颜色通道会被转换。带透明度的八位十六进制代码不被接受。
支持 tomato 或 rebeccapurple 这样的命名颜色吗?
不支持。此工具只能读取三位或六位十六进制,以及 rgb() 或 rgba() 值。