Transparent ARGB hex value
Solution 1
Transparency is controlled by the alpha channel (AA
in #AARRGGBB
). Maximal value (255 dec, FF hex) means fully opaque. Minimum value (0 dec, 00 hex) means fully transparent. Values in between are semi-transparent, i.e. the color is mixed with the background color.
To get a fully transparent color set the alpha to zero. RR
, GG
and BB
are irrelevant in this case because no color will be visible. This means #00FFFFFF
("transparent White") is the same color as #00F0F8FF
("transparent AliceBlue").
To keep it simple one chooses black (#00000000
) or white (#00FFFFFF
) if the color does not matter.
In the table you linked to you'll find Transparent
defined as #00FFFFFF
.
Solution 2
Here is the table of % to hex values:
Example: For 85% white, you would use #D9FFFFFF
.
Here 85% = "D9" & White = "FFFFFF"
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
How is it calculated?
FF is number written in hex mode. That number represent 255 in decimal. For example, if you want 42% to calculate you need to find 42% of numbeer 255 and convert that number to hex. 255 * 0.42 ~= 107 107 to hex is "6B – maleta
Solution 3
Adding to the other answers and doing nothing more of what @Maleta explained in a comment on https://stackoverflow.com/a/28481374/1626594, doing alpha*255 then round then to hex. Here's a quick converter http://jsfiddle.net/8ajxdLap/4/
function rgb2hex(rgb) {
var rgbm = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?((?:[0-9]*[.])?[0-9]+)[\s+]?\)/i);
if (rgbm && rgbm.length === 5) {
return "#" +
('0' + Math.round(parseFloat(rgbm[4], 10) * 255).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[1], 10).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[2], 10).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[3], 10).toString(16).toUpperCase()).slice(-2);
} else {
var rgbm = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
if (rgbm && rgbm.length === 4) {
return "#" +
("0" + parseInt(rgbm[1], 10).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[2], 10).toString(16).toUpperCase()).slice(-2) +
("0" + parseInt(rgbm[3], 10).toString(16).toUpperCase()).slice(-2);
} else {
return "cant parse that";
}
}
}
$('button').click(function() {
var hex = rgb2hex($('#in_tb').val());
$('#in_tb_result').html(hex);
});
body {
padding: 20px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Convert RGB/RGBA to hex #RRGGBB/#AARRGGBB:<br>
<br>
<input id="in_tb" type="text" value="rgba(200, 90, 34, 0.75)"> <button>Convert</button><br>
<br> Result: <span id="in_tb_result"></span>
Solution 4
BE AWARE 👇🏼
In HTML/CSS (browser code) the format is #RRGGBBAA
with the alpha channel as last two hexadecimal digits.
Solution 5
Just use this :
android:background="#00FFFFFF"
it will do your work.
Related videos on Youtube
user3332579
Updated on August 16, 2021Comments
-
user3332579 almost 3 years
The colors in this table is all not transparent. I guess the value for the
A
is set toFF
.What is the code for transparency?
For example this color FFF0F8FF (AliceBlue), to a transparent code such as
??F0F8FF
?-
Almir Campos about 4 yearsFinally there is a way to set transparent color with hex code for certain browsers (new feature). Please, take a look at stackoverflow.com/a/60876347/2457251
-
-
user3332579 about 10 yearslet's say I need 50% opacity. What is the code for white color with 50% opacity/transparent?
-
theHacker about 10 years@user3332579: 50% is
7F
. Put your calculator in hex mode, it will do the trick for you. -
theHacker about 10 years@user3332579: So 50% white is
#7FFFFFFF
. -
Saeed Jassani over 7 yearshow do you calculate this?
-
maleta over 7 years@SaeedJassani FF is number written in hex mode. That number represent 255 in decimal. For example, if you want 42% to calculate you need to find 42% of numbeer 255 and convert that number to hex. 255 * 0.42 ~= 107 107 to hex is "6B"
-
Saeed Jassani over 7 years@Maleta Thanks a lot
-
SGS Sandhu about 6 yearsThe format is #RRGGBBAA Hex8 (or #RGBA in Hex4) and NOT #AARRGGBB (or #ARGB) I have tested in Chrome 62,63,64 Refer to CanIUse.com , https://css-tricks.com/8-digit-hex-codes/ , Chrome Feature Status
-
theHacker about 6 years@SGSSandhu The question is not targeted at CSS. See the question again, the format is ARGB.
-
Dale Clifford almost 4 yearsIt's important if you're using gradients - otherwise blending through white will show traces of grey.