Transparent ARGB hex value

ColorsHexArgb

Colors Problem Overview


The colors in this table is all not transparent. I guess the value for the A is set to FF.

What is the code for transparency?

For example this color FFF0F8FF (AliceBlue), to a transparent code such as ??F0F8FF ?

Colors Solutions


Solution 1 - Colors

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

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 2 - Colors

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 3 - Colors

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 - Colors

BE AWARE 

In HTML/CSS (browser code) the format is #RRGGBBAA with the alpha channel as last two hexadecimal digits.

Solution 5 - Colors

Just use this :

android:background="#00FFFFFF"

it will do your work.

Solution 6 - Colors

If you have your hex value, and your just wondering what the value for the alpha would be, this snippet may help:

const alphaToHex = (alpha => {
  if (alpha > 1 || alpha < 0 || isNaN(alpha)) {
    throw new Error('The argument must be a number between 0 and 1');
  }
  return Math.ceil(255 * alpha).toString(16).toUpperCase();
})

console.log(alphaToHex(0.45));

Solution 7 - Colors

Just came across this and the short code for transparency is simply #00000000.

Solution 8 - Colors

The standard hex color code has six characters eg #000000 - black, and the hex color code with more than six characters(likely 8 characters eg #82bc00 - green) exceeds the standard amount making the other two last characters define the transparency level. so if you need to attain absolute transparency you can add 00 to any hex color but for uniformity you can just use #00000000

.green{
  background: #82bc00      /*actual green*/
}
.subgreen{
  background: #82bc0070    /*green with little transparency*/
}
.greenparency{
  background: #82bc0040    /*green with much transparency*/
}
.transparency{
  background: #82bc0000    /*full transparency over green*/
}

<div class="green"> green background color </div>
<div class="subgreen"> green background color </div>
<div class="greenparency"> green background color </div>
<div class="transparency"> green background color </div>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser3332579View Question on Stackoverflow
Solution 1 - ColorsShivaraj PatilView Answer on Stackoverflow
Solution 2 - ColorstheHackerView Answer on Stackoverflow
Solution 3 - Colorsuser1626594View Answer on Stackoverflow
Solution 4 - ColorsBernoulli ITView Answer on Stackoverflow
Solution 5 - ColorsAditya Singh RajputView Answer on Stackoverflow
Solution 6 - ColorsRaphael AleixoView Answer on Stackoverflow
Solution 7 - ColorsOlami_dipupoView Answer on Stackoverflow
Solution 8 - ColorsAbdulbasitView Answer on Stackoverflow