Formula for finding out the result of a color after applying x% opacity to it?

I have 2 colors

  1. #a1a2a4
  2. black (#000000)
  3. white (#ffffff)

Now I need to know how much opacity (in a percent) must I apply to the second color (black) against a background of the third color (white) to achieve a color “closest” (as determined by the eye) to the first color (#a1a2a4).

How do I go about doing it?


This case is more or less simple (you’re dealing with black and white).

After applying the color (#a1a2a4), check the RGB levels:

RGB levels

You can see it has approximately 162 (average), and knowing that it can go from 0 to 255, you just need to find out the percent:

162 * 100 / 255 = ~63,5%

Now, because RGB works in the opposite way compared to CMYK (in terms of colour mixing, ie full colour mix means white and with CMYK full colour mix means black), the actual percent in this case is the difference between 100% and the value that we got:

100 – 63,5 = 36,5%

So if you apply 36% of opacity, it will have this colour, I just tested it.

Of course in cases with more complex colours, this method doesn’t work and I don’t know of a way to get the percent, I would do the classic trial and error.

Source : Link , Question Author : Pacerier , Answer Author : jackJoe

Leave a Comment