How to set just a percentage of a color in CSS?

Question

I have some GUI guidelines where these color are specified:

text-color: #000 87%
background-color of the container: #000 20%

How can I apply those requirements in CSS?

I have read this post: https://stackoverflow.com/a/12021283

But it didn't help me.

Thanks in advance!

Answer 1

Use RBGA:

text-color: #000 87%

would translate to:

color: RGBA(0,0,0,.87)

This is assuming they are asking for a percentage of opacity.

If, on the other hand, they are asking for a tint, that's a bit more difficult to handle. Not so much with black (as that translates to varying shades of gray) but mostly impossible with color as it would depend on which color model you are using to calculate the tint value. So, if they are asking for a completely opaque tint, tell whoever spec'd out the colors that they need to give you precise RGB or Hex values.