Javascript 在Houdini CSS上创建亮度函数

是否可以使用Houdini API创建“亮度”函数

例如：

假设您创建了一个CMS，人们可以在其中自定义10种颜色。然而，页面中的一些细节应该有一种与原来10种颜色不同的颜色，有时更暗，有时更亮

:root {
   --color-primary: #5a9e6f;
}

.box {
   color: var(--color-primary);
   border-color: brightness(var(--color-primary), -15%);
   background-color: brightness(var(--color-primary), -40%);
}

---

如果是这样的话，您个人如何创建该工作集？

使用Houdini是一个核心请求，还是您只是希望问题得到解决

如果你想晚一点，你可以通过BoltClock在这里发布想法

并将其扩展为使用hsl，这将为您提供亮度调整，而不是alpha：

：根目录{
--颜色：20,40%；
--亮度：50%；
}
div{
宽度：100px；
高度：100px；
显示：内联块；
背景色：hsl（var（--颜色），var（--亮度））；
}
.基地{
/*此处无任何内容，默认值*/
}
.黑暗{
--亮度：30%；
}
.光{
--亮度：70%；
}

BASE
黑暗的
LIGHT

这些术语中的某些内容：您正在寻找这个：当然。谢谢Temani=），但在我花几天时间阅读W3C文档之前，我想知道这是否可行。似乎是这样。但是在这种情况下，我想知道为什么还没有人这么做。houdni的支持率仍然很低，所以你不会很快找到很多这样的支持率。你不需要花上几天的时间阅读。几分钟应该足以理解paint API的用途，但是如果您想要有一个工作代码（并且您可能是第一个实现亮度函数的人；），您可能需要更多的时间。您可以在这里遵循以下状态：。。Firefox仍然不支持任何与API相关的功能：但这对任何颜色格式都不起作用Hi vals和Temani，谢谢您的回答！我以前已经看过这些方法了。。。不久前，我对它们进行了彻底的实验。不幸的是，这个项目与项目的一些需求不一致。也许有一天我可以收养他们，但现在我真的想调查霍迪尼的选择。。。更重要的是，现在有一个polifill我可以测试。@Temaniaff如果抱歉，我似乎几乎复制了你的答案！你也有同样的想法；）