0

I'm using CSS variables for my colors, but my designers just love hitting me with a 'its that same color, but with an opacity'.

I know its possible to do a #ff000099 (the 2 last digits being the opacity) but now I'm looking to be able to cocatenate the color (#ff0000) and then add that opacity at the end.

What I tried was something like background:var(--color)99 but that doesnt seem to work.

So is there a way to add an opacity to a hexadecimal color that is set with a variable?

Fredy31
  • 2,660
  • 6
  • 29
  • 54

1 Answers1

-2

Is it different than this?

div {
  opacity: 0.5;
}

https://www.w3schools.com/cssref/css3_pr_opacity.asp

  • It is different, opacity on text color will just fade out text a little, div opacity will fade out whole div, which is not always needed. And it's not answering the question, author asked for – Vladislav Akhmetvaliyev Aug 17 '22 at 17:14
  • To add to what was said before: I need it on the background. Doing it like that will put an opacity on it all, background, image, text, whatever. – Fredy31 Aug 17 '22 at 17:16