Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

computing RGBA to match an RGB color

Tags:

colors

If I have an RGB color, with 100% opacity.

I want that same color (or close to it) with a transparent alpha channel. I will paint the transparent color over a white background.

How do I compute the RGBA color?

I guess what I am asking is the opposite of this question.

like image 607
jedierikb Avatar asked Dec 28 '12 01:12

jedierikb


People also ask

Is rgba same as RGB?

RGB is a three-channel format containing data for Red, Green, and Blue. RGBA is a four-channel format containing data for Red, Green, Blue, and an Alpha value. The CSS function rgb() has wide browser support. The CSS function rgba() may have limited support in the older browser.

What does rgba 255 0 0 0.2 color code in CSS means?

RGB Value. Each parameter (red, green, and blue) defines the intensity of the color between 0 and 255. For example, rgb(255, 0, 0) is displayed as red, because red is set to its highest value (255) and the others are set to 0. To display black, set all color parameters to 0, like this: rgb(0, 0, 0).


1 Answers

You mean you want the RGBA color with maximum transparency which, when drawn on top of a white background, gives the original RGB color?

Let R0, G0 and B0 be the components of the original color, each ranging from 0.0 to 1.0, and let R, G, B and A be the components of the new RGBA color (with A = 1 denoting 100% opacity). We know that the colors must satisfy:

R0 = A·R + (1 − A)
G0 = A·G + (1 − A)
B0 = A·B + (1 − A)

which, if we knew A, we could easily solve for R, G and B:

R = (R0 − 1 + A) / A = 1 − (1 − R0) / A
G = (G0 − 1 + A) / A = 1 − (1 − G0) / A
B = (B0 − 1 + A) / A = 1 − (1 − B0) / A

Since we require that R ≥ 0, G ≥ 0 and B ≥ 0, it follows that 1 − R0 ≥ A, 1 − G0 ≥ A and 1 − B0 ≥ A, and therefore the smallest possible value for A is:

A = max( 1 − R0, 1 − G0, 1 − B0 ) = 1 − min( R0, G0, B0 )

Thus, the color we want is:

A = 1 − min( R0, G0, B0 )
R = 1 − (1 − R0) / A
G = 1 − (1 − G0) / A
B = 1 − (1 − B0) / A


Ps. For a black background, the same formulas would be even simpler:

A = max( R0, G0, B0 )
R = R0 / A
G = G0 / A
B = B0 / A


Pps. Just to clarify, all the formulas above are for non-premultiplied RGBA colors. For premultiplied alpha, just multiply R, G and B as calculated above by A, giving:

R = A · ( 1 − (1 − R0) / A ) = R0 − (1 − A)
G = A · ( 1 − (1 − G0) / A ) = G0 − (1 − A)
B = A · ( 1 − (1 − B0) / A ) = B0 − (1 − A)

(or, for a black background, simply R = R0, G = G0 and B = B0.)

like image 193
Ilmari Karonen Avatar answered Sep 23 '22 17:09

Ilmari Karonen