Sass/Compass - Convert Hex, RGB, or Named Color to RGBA
Use the rgba
function built into Sass
Sets the opacity of a color.
Examples:
rgba(#102030, 0.5) => rgba(16, 32, 48, 0.5)
rgba(blue, 0.2) => rgba(0, 0, 255, 0.2)Parameters:
(Color) color
(Number) alpha — A number between 0 and 1Returns:
(Color)
Code:
rgba(#ff0000, 0.5); // Output is rgba(255,0,0,0.5);
The rgba function doesn't work on color with no transparency, it returns an hex again. After all, it's not meant to transform hex to rgba, we're just making profit out of hex doesn't allow alpha (yet).
rgba(#fff, 1) // returns #fff
So, I made al little functions that buils the rgb string. I don't need to deal with transparencies for now.
@function toRGB ($color) {
@return "rgb(" + red($color) + ", " + green($color) + ", " + blue($color)+ ")";
}