Sass顏色功能 - 包含多個

Question

我有HSL顏色，我需要，例如，一次調整色調，飽和度和亮度。我注意到，如果我一個一個這樣做，如在

$color: hsl color code; 

$new-color: adjust-hue($color, -1); 
$new-color: lighten($color, 20%); 
$new-color: desaturate($color, 10%); 

它實際上並沒有正確應用它們。所以我的問題是，我怎樣才能把它包裝在一個函數或混合中（在這種情況下更合適），使它看起來更乾淨並且行爲正確呢？謝謝！

Answer 1

首先，在您當前的代碼中，您正在更新$color變量的變量$new-color，該變量在每個步驟都是不正確的。

現在，如果您想一次調整色相，飽和度和亮度，那麼adjust-color()（See documentation）就是您要查找的內容。

例如，以下是相當於

$color: hsl(120,100%,50%); 

$new-color: adjust-hue($color, -1); 
$new-color: lighten($new-color, 20%); 
$new-color: desaturate($new-color, 10%); 

這

$color: hsl(120,100%,50%); 

$new-color: adjust-color($color, $hue: -1,$lightness: 20%, $saturation: -10%);