Home > Software design >  How to change the RGB value of a variable in to string in SASS?
How to change the RGB value of a variable in to string in SASS?

Time:12-31

I have been trying to change the value of a variable to string, I have read and tried some built-in SASS functions. As an example look at the code below:

$primary-color: rgb(0, 0, 0);
$string: quote($primary-color); // => "#000000"

// But I want to have it as "rgb(0, 0, 0)".

Thanks

CodePudding user response:

$primary-color variable is known as a color type by SASS and won't save its format. The goal is reachable by using interpolation (#{}) and the sass:color module. More information about them is available at the following links:

https://sass-lang.com/documentation/interpolation

https://sass-lang.com/documentation/modules/color#red

In the following code, statement between #{ and } is a SASS code and will process by SASS. red is a function that gets the red part number of a color; also green and blue are the same as red function for their colors.

$string: "rgb(#{red($primary-color)},#{green($primary-color)},#{blue($primary-color)})"; // => "#000000"
  • Related