如何将rgba转换为透明度调整的十六进制？
如何将rgba转换为透明度调整的十六进制？
提问于 2013-04-09 17:50:03
我想知道如何将rgba转换为hex，将可见的rgba颜色(包括透明度)转换为十六进制值。
假设我有这个：
rgba(0,129,255,.4)它是一种“浅蓝色”...
我想知道有没有办法获得相同的十六进制浅蓝色“可见”的颜色，所以我不想转换的#0081ff，而是一些接近屏幕上可见的颜色。
问题：
如何将rgba转换为透明度调整的十六进制？
回答 3
Stack Overflow用户
回答已采纳
发布于 2013-04-09 17:57:54
这取决于将应用透明颜色的背景。但如果您知道背景的颜色(例如白色)，则可以计算应用于特定背景的RGBA颜色所产生的RGB颜色。
它只是颜色和背景之间的加权平均值，权重是alpha通道(从0到1)：
Color = Color * alpha + Background * (1 - alpha);对于白色rgb(255,255,255)背景下的透明浅蓝色rgba(0,129,255,.4)：
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(153,205,255)或#99CDFF
Stack Overflow用户
发布于 2016-02-27 07:35:53
function hexify(color) {
var values = color
.replace(/rgba?\(/, '')
.replace(/\)/, '')
.replace(/[\s+]/g, '')
.split(',');
var a = parseFloat(values[3] || 1),
r = Math.floor(a * parseInt(values[0]) + (1 - a) * 255),
g = Math.floor(a * parseInt(values[1]) + (1 - a) * 255),
b = Math.floor(a * parseInt(values[2]) + (1 - a) * 255);
return "#" +
("0" + r.toString(16)).slice(-2) +
("0" + g.toString(16)).slice(-2) +
("0" + b.toString(16)).slice(-2);
}
var myHex = hexify('rgba(57,156,29,0.05)'); // "#f5faf3"
console.log(myHex);
Stack Overflow用户
发布于 2019-12-19 04:27:04
通过使用chrome的吸管工具，你可以节省一些时间和计算。我通常做的是将一个大div的背景颜色设置为rgba，然后在CSS中添加一个颜色属性到某个随机的十六进制值。然后，您只需单击该随机十六进制值旁边的彩色方块，将鼠标悬停在页面上具有背景色的div上，并使用滴管选择背景色。如果它返回为rgba，您可以通过再次单击该彩色方块并单击右侧的向上和向下箭头在hsla、rgba和十六进制之间循环。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15898740
复制相关文章
相似问题
腾讯云开发者
