i got already pre-defined colors in css and im trying to incorporate this colors into a linear gradient with an image as a background-image , how i could increase the opacity for these colors in this following code coz currently the image is not visible at all?
background-image: linear-gradient( to right bottom, var(–color-primary), var(–color-primary-dark)),url(…/css/img/HeaderBG.jpg);
Use rgba or hsla colours. Like --some-colour: rgba(0,0,0,0.3).
There are multiple colour converters online if you have (eg) hex or named colours currently. W3Schools has a colour converter tool that accepts named colours, there will be many others online, that’s just the first one I found on Google that worked on my phone: https://www.w3schools.com/colors/colors_converter.asp
It doesn’t generate rgba/hsla, but the difference between them is like this:
rgb(0, 191, 255)
rgba(0, 191, 255, 1)
Where the extra number is the alpha channel, and between 0 and 1
alternatively if you want to blend two backgrounds (ie in your case a gradient and an image), you can use CSS blend modes (background-blend-mode is the attribute you would use). Examples: https://getflywheel.com/layout/css-blend-modes/