Convert RGBA Color to RGB
Remove the transparency from an RGBA color and get the opaque RGB that looks the same over the background you choose.
Your data is never sent to any server.
The RGBA to RGB converter removes the transparency from a color and gives
you the opaque color that looks the same over the background you choose. Use it
to take an rgba() from your CSS to places that do not support transparency
without changing how it looks.
Why the background changes the result
A color with an alpha below 1 lets part of the background through. The browser
blends both channel by channel, so the same rgba() produces different colors
depending on what is underneath. For example, with the blue rgba(59, 130, 246, 0.2):
| Background | Resulting RGB | Hex |
|---|---|---|
| White | rgb(216, 230, 253) | #D8E6FD |
| Black | rgb(12, 26, 49) | #0C1A31 |
Over white it is a pastel blue and over black a navy that is almost black. That is why the tool asks for the background before calculating.
What it’s for
- Exporting to formats without transparency: JPG, HTML emails or documents for print.
- Moving a design to another tool: many programs and libraries only accept opaque RGB colors.
- Avoiding unexpected overlays: a semi-transparent background changes color when what is underneath changes; an opaque one always looks the same.
- Measuring real contrast: contrast checkers need the color that is finally visible, not the one with transparency.
How to use RGBA to RGB
- 1
Enter the RGBA color
Type the R, G and B channels (0 to 255) and the alpha A (0 to 1). If you come from another color tool, the values are filled in for you.
- 2
Choose the background
Set the color it will be shown on: white, black or any hex. The result depends on the background, because a transparent color lets what is underneath show through.
- 3
Copy the solid RGB
Copy the resulting rgb() or hex. It is an opaque color that looks exactly like your RGBA on that background.
Frequently asked questions
How do you convert RGBA to RGB?
Each channel is blended with the background according to the alpha: result = color × alpha + background × (1 − alpha). For example, black at 50% over white gives 0 × 0.5 + 255 × 0.5 = 127.5, which rounds to 128. The result is rgb(128, 128, 128).
Why do I need to set a background?
Because a transparent color has no fixed look: the same rgba() looks light over white and dark over black. To replace it with an opaque color you need to know what it will be painted on.
Can't I just drop the fourth value of rgba()?
Only if the alpha is 1. Otherwise the color becomes fully opaque and looks stronger than before. A blue at 20% over white is a very pale blue, and dropping the alpha would give you the pure blue.
When do I need a color without transparency?
In JPG images, which have no alpha channel, in many email clients, in print, and in any program that only accepts RGB. Also when checking text contrast, which must be measured with the color that is actually visible.
Is the result exact?
It is the same calculation the browser performs when compositing colors, rounded to the nearest integer on each channel. Rounding moves each channel by half a unit at most, which the eye cannot see.