'Is it possible to assign opacity to a SCSS hex color variable, re using that variable?
I have a series of scss variables representing colors re used throughout my app, like so:
$first-color: #00755E
I also have colors that are the same as this first color, but it's their hex values with opacity. Like this one here is $first-color with 0.05 opacity.
$first-with-opacity: #F2F8F7
What I would like to be able to do is to re use this $first-color variable in the $first-with-opacity variable, so that if this $first-color ever changes, I don't have to also change $first-with-opacity to match that new color with the same opacity.
Due to limitations within the app, I can't use rgba values in this and other scenarios. What I'd like to know is, is it possible for me to re use that variable ($first-color) and attach an opacity value to it, without using rgba?
To be clear, what's below will NOT work:
$first-with-opacity: rgba($color: $first-color, alpha: 0.05) //this solution will not work in this scenario
Solution 1:[1]
Here you go...
WRONG:
$first-with-opacity: rgba($color: $first-color, alpha: 0.05);
CORRECT:
$first-with-opacity: rgba($first-color, 0.05);
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | Cervus camelopardalis |