Javascript生成具有等效高光的随机颜色

我正在使用库，我需要为图表单元生成随机颜色

我看到了很多关于如何做到这一点的答案。比如说

问题是，我还需要它的等效高亮颜色（或任何相近的颜色）来实现charts.js饼图的“highlight”字段

{
    value: 300,
    color: "#30a5ff",
    highlight: "#62b9fb",
    label: "Label"
},

---

这是许多可能的解决方案之一。获取介于0和360之间的随机色调。使用100%饱和度和50%明度作为主颜色，使用100%饱和度和80%明度作为“高光”颜色。只需继续单击“运行代码片段”按钮即可看到更多随机颜色

document.querySelectorAll（'div'）.forEach（d=>{
const hue=Math.floor（Math.random（）*360）；
d、 style.backgroundColor=`hsl（${hue}，100%，50%）`；
d、 style.borderColor=`hsl（${hue}，100%，80%）`；
});
div{
显示：内联块；
宽度：20px；
高度：20px；
边框：实心5px；
保证金：5px；
}
以下是众多可能的解决方案之一。获取介于0和360之间的随机色调。使用100%饱和度和50%明度作为主颜色，使用100%饱和度和80%明度作为“高光”颜色。只需继续单击“运行代码片段”按钮即可看到更多随机颜色


document.querySelectorAll（'div'）.forEach（d=>{
const hue=Math.floor（Math.random（）*360）；
d、 style.backgroundColor=`hsl（${hue}，100%，50%）`；
d、 style.borderColor=`hsl（${hue}，100%，80%）`；
});
div{
显示：内联块；
宽度：20px；
高度：20px；
边框：实心5px；
保证金：5px；
}

如果你投了反对票，请至少提供一个解释。我认为这是使用charts.js时非常常见的情况。原始颜色和高光颜色之间的关系是什么？颜色补码？只是两种随机不同的颜色？相同的色调，但较暗/较亮。。。正如我所写的，任何相近的颜色都可以，越亮越好。我想你给了我一些可以使用的东西，但你说的“相近”是什么意思？色调相同但亮度略有不同？亮度相同但色调略有不同？只是模糊地在某个靠近彩色轮子的地方？还有什么？使用HSL颜色值，即
HSL（色调、饱和度、光线）
使这类事情变得微不足道-即使在IE中也支持IE9如果你投了反对票，请至少提供一个解释。我认为这是使用charts.js时非常常见的情况。原始颜色和高光颜色之间的关系是什么？颜色补码？只是两种随机不同的颜色？相同的色调，但较暗/较亮。。。正如我所写的，任何相近的颜色都可以，越亮越好。我想你给了我一些可以使用的东西，但你说的“相近”是什么意思？色调相同但亮度略有不同？亮度相同但色调略有不同？只是模糊地在某个靠近彩色轮子的地方？还有什么吗？使用HSL颜色值，即
HSL（色调、饱和度、光线）
使这类事情变得微不足道-甚至在IE9之后的IE中也支持