Css 如何将rgba转换为透明度调整的十六进制？

我想知道如何将

rgba

转换为

hex

，将可见的rgba颜色（包括透明度）转换为十六进制值

假设我有这个：

rgba(0,129,255,.4)

这是一种“浅蓝色”

我想知道是否有办法以十六进制获得相同的浅蓝色“可见”颜色，因此我不希望转换后的

\0081ff

颜色接近屏幕上可见的颜色

问题：

---

如何将rgba转换为透明度调整的十六进制？

这取决于将应用透明颜色的背景。 但是，如果您知道背景的颜色（例如白色），则可以计算应用于特定背景的RGBA颜色所产生的RGB颜色

它只是颜色和背景之间的加权平均值，权重为alpha通道（从0到1）：

对于透明的浅蓝色

rgba（0129255.4）

与白色

rgb（255255255）

：

Red   =   0 * 0.4 + 255 * 0.6 = 153
Green = 129 * 0.4 + 255 * 0.6 = 204.6
Blue  = 255 * 0.4 + 255 * 0.6 = 255

它给出了rgb（153205255）或

#99CDFF

函数hexify（彩色）{
var值=颜色
.替换（/rgba？\（/，“”）
.替换（/\）/，“”）
.替换（/[\s+]/g''）
.split（'，'）；
var a=parseFloat（值[3]| | 1），
r=数学层（a*parseInt（值[0]）+（1-a）*255），
g=数学层（a*parseInt（值[1]）+（1-a）*255），
b=数学层（a*parseInt（值[2]）+（1-a）*255）；
返回“#”+
（“0”+r.toString（16））.slice（-2）+
（“0”+g.toString（16））.slice（-2）+
（“0”+b.toString（16））.slice（-2）；
}
var myHex=hexify（'rgba（57156,29,0.05）；//“#f5faf3”
console.log（myHex）使用chrome的滴管工具，您可以节省一些时间和计算。我通常做的是将一个大div的背景色设置为rgba，然后在CSS中为一些随机十六进制值添加一个颜色属性。然后你只需点击随机十六进制值旁边的彩色方块，将鼠标悬停在页面上具有背景色的div上，然后使用滴管选择背景色。如果它返回为rgba，您可以通过再次单击该彩色正方形并单击右侧的上下箭头，在hsla、rgba和十六进制之间循环
 您是否尝试过使用该alpha百分比来更改其余的值？我假设您希望在白色背景下使用rgba值，因此使用百分比来等于“白色”值。例如：0129255.4==102231255？？？只是一个猜测谢谢-真的帮了大忙！我试过很多在线转换工具，但没有一个能够正确转换alpha通道。他们不理解“rgba（0,0,0,0.6）”，不断返回“000000”，尽管是全黑的，但他们正在绘制的画布是灰色的。但是您的hexify函数正确地将其转换为#666666，并将rgba（0,0,0.2）转换为#cccc谢谢！
Red   =   0 * 0.4 + 255 * 0.6 = 153
Green = 129 * 0.4 + 255 * 0.6 = 204.6
Blue  = 255 * 0.4 + 255 * 0.6 = 255