为什么 SASS Saturation 颜色函数会导致与 Mac 颜色选择器不同的值？答案

【问题标题】：Why does SASS Saturation color function results in different value from Mac color picker?为什么 SASS Saturation 颜色函数会导致与 Mac 颜色选择器不同的值？
【发布时间】：2019-12-02 07:49:28
【问题描述】：

我正在使用 SASS HSL 颜色函数从 HEX 颜色中获取单个值。同时，我在 Mac 颜色选择器中输入了相同的 HEX 值。但是 SASS 颜色函数和 Mac 颜色选择器产生的 saturation 值是不同的。这是为什么呢？

这是带有结果的 SASS 代码：

$color: #3e8fcb;
@debug $color;
@debug 'Hue' round( hue($color) );
@debug "Sat" round( saturation($color) );
@debug "Lht" round( lightness($color) );

这是 Mac 颜色选择器：

如您所见，饱和度的区别：

SASS：58%
Mac 颜色选择器：69%

为什么？

【问题讨论】：

标签： macos function sass colors color-picker

【解决方案1】：

这是因为 SASS 颜色函数使用 HSL 颜色模型，而 Mac 颜色选择器使用 HSB（与 HSV 相同）颜色模型。在 HSB 和 HSL 中，色调是相同的，但 饱和度采用不同的值。

在这个答案中解释： HSB vs HSL vs HSV

在维基百科中： https://en.wikipedia.org/wiki/HSL_and_HSV

【讨论】：