javascript - 以编程方式遍历色轮并访问十六进制值或 rgb

Question

使用 css 和 javascript 我想随着时间的推移巧妙地改变文本的颜色。使用javascript这应该相对简单。

然而，为了确保平稳过渡，我只想进行小的增量颜色变化......希望下面解释：

粗略的箭头显示了我想要实现的颜色模式，它们是实现这些值的现有算法吗？还是有什么其他方法？

Answer 1

在 HSL 中指定颜色并仅循环色调

var i = 0
setInterval(function(){
    i++
    if(i > 360){ i = 0 }
    document.body.style.color = "hsl("+(i)+",50%,50%)"
},100)

或者更简洁一点

var i = 0
setInterval(function(){
    document.body.style.color = "hsl("+((i++)%360)+",50%,50%)"
},100)

Answer 2

使用 HSL 颜色并将色调从 0 旋转到 360：

text.style.color = 'hsl(' + hue + '80%, 40%)';