April 2013
Intermediate to advanced
274 pages
5h 39m
English
If you want to convert an existing color value (defined as either a variable or hex value) to an RGBA value (including an alpha layer for transparency), use the rgba function:
background-color: rgba(red,.9);
This will produce following CSS:
background-color: rgba(255, 0, 0, 0.9);
The two arguments needed are the color and then the value of the alpha layer (0 is entirely transparent, 1 is entirely opaque, .5 is halfway between the two).
From a practical point of view, it's similar to transparentize/fade-out and opacify/fade-in.
Be aware that unless the value passed for the alpha layer is less than 1, Sass will compile the resultant color as a hex value or a named CSS color.
Read now
Unlock full access