scale-color($color, $kwargs)

Scales one or more properties of a color by a percentage value. Unlike ​adjust-color($color, $kwargs)​, which changes a color’s properties by fixed amounts, scale_color fluidly changes them based on how high or low they already are. So if we use scale color twice: scale-color scale-color, it won’t change the lightness much, but lightening a dark color by the same amount will change it more dramatically. This has the benefit of making ‘scale-color($color, ...)‘ have a comparable effect across color palettes.

For example, the lightness of a color can be anywhere between 0 and 100. If ‘scale-color($color, $lightness: 40%)‘ is called, the resulting color’s lightness will be 40% of the way between its original lightness and 100. If ‘scale-color($color, $lightness: -40%)‘ is called instead, the lightness will be 40% of the way between the original and 0.

This can change the red, green, blue, saturation, value, and alpha properties. The properties are specified as keyword arguments. All arguments should be percentages between 0% and 100%. All properties are optional.

You can’t specify both RGB properties (‘$red‘, ‘$green‘, ‘$blue‘) and HSL properties (‘$saturation‘, ‘$value‘) at the same time.