css - How do I convert a hexadecimal color to rgba with the Less compiler?

Question

I have the following code:

@color : #d14836;

.stripes span {
    -webkit-background-size: 30px 30px;
    -moz-background-size: 30px 30px;
    background-size: 30px 30px;
    background-image: -webkit-gradient(linear, left top, right bottom,
        color-stop(.25, rgba(209, 72, 54, 1)), color-stop(.25, transparent),
        color-stop(.5, transparent), color-stop(.5, rgba(209, 72, 54, 1)),
        color-stop(.75, rgba(209, 72, 54, 1)), color-stop(.75, transparent),
        to(transparent));

I need to convert @color to rgba(209, 72, 54, 1).

So I need to replace rgba(209, 72, 54, 1) in my code with a Less function that generates an rgba() value from my @color variable.

How can I do this with Less?

Answer 1

Actually, the Less language comes with an embedded function called fade. You pass a color object and the absolute opacity % (higher value means less transparent):

fade(@color, 50%);   // Return @color with 50% opacity in rgba