logo标签列表

灰度图像转化为黑色透明度的转换

csscolorshexrgbopacity
7
我已经发现了。
color: rgb(51, 51, 51);

并且

color: #333333;

并且

color: black; opacity: 0.8;

所有的产生的灰度色调都是等价的。

我该如何概括这个呢？

换句话说，给定任意一个RGB或HEX颜色/灰度级别，当使用color: black;时，我怎样确定对应的opacity值呢？

这里是Codepen演示。

<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>
1
请查看 https://www.viget.com/articles/equating-color-and-transparency。 - Ovidiu Unguru
2个回答
7

在遇到相似的问题后，我已经创建了一个工具来在您的浏览器中实现这一目标。您只需要输入十六进制颜色代码，它就会给您一个对应的RGBA值。欢迎随意尝试 ;)

https://aclarembeau.github.io/grayscale-to-opacity/

4
您可以使用此Hex工具网站。使用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
不确定这如何解决所提出的问题。楼主想要将任何灰度颜色转换为以黑色为基础的颜色，并具有不同的透明度值。 - undefined
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接