CODEWITHSUNDEEP
csssass
Matilda Yi Pan
Matilda Yi Pan

Reputation: 658

SCSS has the color in rgba() format, but the color is in hex format. How to keep the color in RGBA() format in the genrated css?

I have a SCSS file, here is one part of it. SCSS: 

$red: 200;
$green: 200;
$blue: 200;
$opa: 1;
.th-layout-class{
    background-color: rgba($red, $green, $blue, $opa);
    padding: 10px;
    border-right: 1px solid grey;
    border-bottom: 1px solid grey;
    border-collapse: collapse; 
}

CSS: 

.th-layout-class, th:nth-child(3) {
  background-color: #c8c8c8;
  padding: 10px;
  border-right: 1px solid grey;
  border-bottom: 1px solid grey;
  border-collapse: collapse; }

Apparently, #c8c8c8 is rgba(200,200,200). But how to have #c8c8c8 in the rgba() format, so that opacity will be applied?

Thank you.

Upvotes: 0

Views: 308

Answers (1)

Scimonster
Scimonster

Reputation: 33409

Because the opacity is 1, it's equivalent to the hex format without any opacity.

As it says here:

In compressed output mode, Sass will output the smallest CSS representation of a color. For example, #FF0000 will output as red in compressed mode, but blanchedalmond will output as #FFEBCD.

If you use a different opacity, it will be forced to use the rgba() format.

Upvotes: 5

Related Questions