SASS中补数和反转之间的差异？

Question

我正在通过SASS文档,发现complement并invert输出相同的结果,你能告诉我这两者有什么区别吗？

//SASS Code
$color:#ff0099;
$complement:complement($color);
//Returns the complement of a color.
$invert:invert($color);//Returns the inverse of a color.
.complement{background:$complement;}
.invert{background:$invert;}

//CSS
.complement {
    background: #00ff66;//Same Color Code
}

.invert {
    background: #00ff66;//Same Color Code
}

Answer 1

出于某种原因,许多在线示例complement/ invert使用颜色值导致两个函数的输出相同.

虽然complement/ invert的许多颜色值是相同的,也有导致不同颜色的多个值.

例:

$color: #ff6699;

complement($color)    = #66ffcc;
invert($color)        = #009966;

要重新说出Sass文档:

补充

返回HSL色轮上180度相反的颜色.

要计算颜色的补码:

1. 将颜色值转换为RGB

   #ff6699 = RGB 255, 102, 153

2. 添加最高和最低RGB值

   255 + 102 = 357

3. 从步骤#2中的数字中减去每个原始RGB值

   (357-255) (357-102) (357-153)
102 255 204

4. 这对应于 #66ffcc

倒置

返回颜色的反转红色,绿色和蓝色值.

要计算颜色的反转:

1. 将颜色值转换为RGB

   #ff6699 = RGB 255, 102, 153

2. 通过从255减去原始RGB值来翻转值

   (255-255) (255-102) (255-153)
0 153 102

3. 这对应于 #009966