JSFiddle - React, Tailwind, and code Playground
HTML
AARRGGBB Color to aRGB Converter<br />
<small>Accepts #AARRGGBB #RRGGBB #RGB formats, with or without the # symbol.</small>
<br /><br />
<input id="hexinput" type='text' />
<br />
<h1 id="results"></h1>
JavaScript
function hexToRgba(hex) {
var bigint, r, g, b, a;
//Remove # character
var re = /^#?/;
var aRgb = hex.replace(re, '');
if (aRgb.length == 3) {
bigint = parseInt(aRgb, 16);
r = (bigint >> 4) & 255;
g = (bigint >> 2) & 255;
b = bigint & 255;
return "rgba(" + r + "," + g + "," + b + ",1)";
}
if (aRgb.length == 6) {
bigint = parseInt(aRgb, 16);
r = (bigint >> 16) & 255;
g = (bigint >> 8) & 255;
b = bigint & 255;
return "rgba(" + r + "," + g + "," + b + ",1)";
}
if (aRgb.length == 8) {
bigint = parseInt(aRgb, 16);
a = ((bigint >> 24) & 255) / 255;
r = (bigint >> 16) & 255;
g = (bigint >> 8) & 255;
b = bigint & 255;
return "rgba(" + r + "," + g + "," + b + "," + a.toFixed(1) + ")";
}
}
$('#hexinput').on('input', function () {
$('#results').text(hexToRgba($('#hexinput').val()));
});
$('#myTextbox1').on('input', function () {
alert('Text1 changed!');
});