RGBA stands for Red-Green-Blue-Alpha and specifies a color using four values which represent the amount of red, green, blue and alpha (opacity) in the color.
Questions tagged [rgba]
538 questions
291
votes
15 answers
CSS hexadecimal RGBA?
I know you can write ...
background-color: #ff0000;
... if you want something that is red.
And you can write ...
background-color: rgba(255, 0, 0, 0.5);
... if you want something red and translucent.
Is there any terse way of writing partially…

Li Haoyi
- 15,330
- 17
- 80
- 137
270
votes
6 answers
Sass - Converting Hex to RGBa for background opacity
I have the following Sass mixin, which is a half complete modification of an RGBa example:
@mixin background-opacity($color, $opacity: .3) {
background: rgb(200, 54, 54); /* The Fallback */
background: rgba(200, 54, 54, $opacity);
}
I have…

Rick Donohoe
- 7,081
- 6
- 26
- 38
208
votes
7 answers
Convert RGB to RGBA over white
I have a hex color, e.g. #F4F8FB (or rgb(244, 248, 251)) that I want converted into an as-transparent-as-possible rgba color (when displayed over white). Make sense? I'm looking for an algorithm, or at least idea of an algorithm for how to do…
user578895
147
votes
8 answers
Convert RGBA PNG to RGB with PIL
I'm using PIL to convert a transparent PNG image uploaded with Django to a JPG file. The output looks broken.
Source file
Code
Image.open(object.logo.path).save('/tmp/output.jpg',…

Danilo Bargen
- 18,626
- 15
- 91
- 127
133
votes
15 answers
112
votes
15 answers
CSS background opacity with rgba not working in IE 8
I am using this CSS for background opacity of a
:
background: rgba(255, 255, 255, 0.3);
It’s working fine in Firefox, but not in IE 8. How do I make it work?

Moon
- 19,518
- 56
- 138
- 200
100
votes
7 answers
Sass/Compass - Convert Hex, RGB, or Named Color to RGBA
This may be Compass 101, but has anyone written a mixin which sets the alpha value of a color? Ideally, I would like the mixin to take any form of color definition, and apply transparency:
@include set-alpha( red, 0.5 ); //prints rgba(255,…

Pat Newell
- 2,219
- 2
- 18
- 23
67
votes
7 answers
CSS: lighten an element on hover
Assuming an element is at 100% saturation, opacity, etc... how can I have its background become slightly lighter when it is hovered?
The use case is that I'm allowing a user to hover over any element on a page. I don't want to go around determining…

Don P
- 60,113
- 114
- 300
- 432
56
votes
5 answers
Overlay a background-image with an rgba background-color
I have a div with a background-image. I want to overlay the background-image with an rgba color (rgba(0,0,0,0.1)) when the user hovers the div.
I was wondering if there's a one-div solution (i.e. not with multiple divs, one for the image and one for…
user1544337
51
votes
8 answers
How to replicate PS multiply layer mode
Does anybody know of a good way to replicate Photoshop's multiply layer mode using either an image or CSS?
I'm working on a project that has thumbnails that get a color overlay when you hover over them, but the designer used a layer set to multiply…

Andrew Philpott
- 939
- 1
- 10
- 11
41
votes
3 answers
How to convert rgba to a transparency-adjusted-hex?
I'm wondering how to convert rgba into hex in a way that translates the visible rgba-color (including transparency) into a hex value.
Say I have this:
rgba(0,129,255,.4)
Which is sort of a "light blue"...
I would like to know if there is a way to…

frequent
- 27,643
- 59
- 181
- 333
37
votes
4 answers
Convert RGBA to HEX
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?

Michael Böckling
- 7,341
- 6
- 55
- 76
33
votes
5 answers
Color similarity/distance in RGBA color space
How to compute similarity between two colors in RGBA color space? (where the background color is unknown of course)
I need to remap an RGBA image to a palette of RGBA colors by finding the best palette entry for each pixel in the image*.
In the RGB…

Kornel
- 97,764
- 37
- 219
- 309
29
votes
2 answers
ValueError: Invalid RGBA argument: What is causing this error?
I am trying to create a 3D colored bar chart using ideas from: this stackoverflow post.
First I create a 3D bar chart with the following code:
import numpy as np
import matplotlib.colors as colors
import matplotlib.cm as cm
import matplotlib.pyplot…

Inspired_Blue
- 2,308
- 3
- 15
- 21
28
votes
6 answers
linear-gradient to transparent bug in latest safari?
I'm applying a basic linear-gradient like this:
background-image: linear-gradient(to top, red, rgba(0,0,0,0));
this behaves as it's supposed to everywhere except in safari where the transparent is rendered as a blackish/greyish color:
here's…

valerio0999
- 11,458
- 7
- 28
- 56