灰度到黑色不透明度转换
Greyscale to black-opacity conversion
我发现了
color: rgb(51, 51, 51);
和
color: #333333;
和
color: black; opacity: 0.8;
所有都产生相同的灰色阴影。
我如何概括这一点?
换句话说,给定一个任意的RGB或HEX color/shade灰度,如何确定color: black;
时opacity
的等效值?
<style>
div {
font-family: sans-serif;
font-size: 48px;
margin: 20px;
padding: 60px;
}
.rgb {
color: rgb(51, 51, 51); /* given this value... */
}
.hex {
color: #333333; /* ...or given this value */
}
.opacity {
color: black;
opacity: 0.8; /* how can I determine this value? */
}
<style>
<body>
<div class="rgb">rgb(51, 51, 51)</div>
<div class="hex">hex #333333</div>
<div class="opacity">opacity 0.8</div>
</body>
您也可以使用这个 Hextool 网站。使用RGBA
。第四个值是该颜色的不透明度。
例如:-
rgba(51, 51, 51, 0.87)
87% 不透明度
十六进制不透明度值
100% — FF
95% — F2
90% — E6
85% — D9
80% — CC
75% — BF
70% — B3
65% — A6
60% — 99
55% — 8C
50% — 80
45% — 73
40% — 66
35% — 59
30% — 4D
25% — 40
20% — 33
15% — 26
10% — 1A
5% — 0D
0% — 00
在遇到类似问题后,我构建了一个工具来在您的浏览器中实现这一点。
你只需要输入你的十六进制颜色,它就会给你一个 rgba 等价物。
随意测试一下 ;)
我发现了
color: rgb(51, 51, 51);
和
color: #333333;
和
color: black; opacity: 0.8;
所有都产生相同的灰色阴影。
我如何概括这一点?
换句话说,给定一个任意的RGB或HEX color/shade灰度,如何确定color: black;
时opacity
的等效值?
<style>
div {
font-family: sans-serif;
font-size: 48px;
margin: 20px;
padding: 60px;
}
.rgb {
color: rgb(51, 51, 51); /* given this value... */
}
.hex {
color: #333333; /* ...or given this value */
}
.opacity {
color: black;
opacity: 0.8; /* how can I determine this value? */
}
<style>
<body>
<div class="rgb">rgb(51, 51, 51)</div>
<div class="hex">hex #333333</div>
<div class="opacity">opacity 0.8</div>
</body>
您也可以使用这个 Hextool 网站。使用RGBA
。第四个值是该颜色的不透明度。
例如:-
rgba(51, 51, 51, 0.87)
87% 不透明度
十六进制不透明度值
100% — FF
95% — F2
90% — E6
85% — D9
80% — CC
75% — BF
70% — B3
65% — A6
60% — 99
55% — 8C
50% — 80
45% — 73
40% — 66
35% — 59
30% — 4D
25% — 40
20% — 33
15% — 26
10% — 1A
5% — 0D
0% — 00
在遇到类似问题后,我构建了一个工具来在您的浏览器中实现这一点。 你只需要输入你的十六进制颜色,它就会给你一个 rgba 等价物。 随意测试一下 ;)