Given a css color value like:
rgba(0, 0, 0, 0.86)
How do I convert that to a RGB hex value that takes the alpha component into account, assuming a white background?
Converting RGBA to hex with the #rgba or #rrggbbaa notation follows virtually the same process as the opaque counterpart. Since the alpha ( a ) is normally a value between 0 and 1, we need to multiply it by 255, round the result, then convert it to hexadecimal.
RGBA (Red, Green, Blue, Alpha) is used for making a colour transparent. The value for A (alpha) is from 0, completely transparent, to 1 completely opaque. hex, is a more recent quick easy value used exclusively for websites and applications.
Since alpha value both attenuates the background color and the color value, something like this could do the trick:
function rgba2rgb(RGB_background, RGBA_color) { var alpha = RGBA_color.a; return new Color( (1 - alpha) * RGB_background.r + alpha * RGBA_color.r, (1 - alpha) * RGB_background.g + alpha * RGBA_color.g, (1 - alpha) * RGB_background.b + alpha * RGBA_color.b ); }
(Try it interactively: https://marcodiiga.github.io/rgba-to-rgb-conversion)
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With