我希望能获得一个基础的 HSL 色值,以实现以下渐变效果:
:root {
--hue: 201;
--saturation: 31;
--lightness: 40;
--mainColor: hsl(var(--hue),var(--saturation),var(--lightness));
--difference: 20; /* 0 + --difference < --lightness < 100 - --difference */
--lightnessPlus: calc(var(--lightness) + var(--difference));
--colorFrom: hsl(var(--hue),var(--saturation),var(--lightnessPlus));
--lightnessMinus: calc(var(--lightness) - var(--difference));
--colorTo: hsl(var(--hue),var(--saturation),var(--lightnessMinus));
}
[...]
.class {
background-image: linear-gradient(to right, var(--colorFrom), var(--colorTo));
}
上述代码生成了一个透明对象,我不理解为什么会这样,请帮忙!