Css 在sass中实现颜色公式以定义调色板

因此，通过“图形设计”堆栈交换，我发现我需要使用此颜色公式来计算调色板的色调：

Y=255 - P*(255-X) where X is a RGB number, P=opacity (0...1), Y=new RGB number 

基本上，我有一些基本颜色，我需要根据白色背景上不透明度的颜色外观，找到一些更亮的版本。这个公式背后的理论应该是可行的，但我不知道如何在sass中实现这一点（我还没有正确地测试这个公式）

为了简单起见，假设我有1种基本颜色：

$primary: #FFA789;

我希望我的色调与输出的50%的不透明度相同

$primary-light: rgba(#FFA789, .5);

---

但是我不希望颜色是不透明的。但我想要与$primary light值相同的色调。-这应该可以通过公式实现

我猜您在获取定义颜色的R、G和B值时遇到了问题。您可以使用red（）、green（）或blue（）函数来实现这一点

所以，你必须这样做

$active-color: #0074D9;
$opacity: 0.5;
$sec-color: rgb(255 - $opacity*(255 - red($active-color)), 255 - $opacity*(255 - green($active-color)), 255 - $opacity*(255 - blue($active-color)));

如果只需要修改一个或两个RGB值，可以使用change_color（）函数，如

$secondary-color: change-color($active-color, $blue: 255 - $opacity*(255 - blue($active-color)), $green: 255 - $opacity*(255 - green($active-color)));

---

我猜您在获取定义颜色的R、G和B值时遇到了问题。您可以使用red（）、green（）或blue（）函数来实现这一点

所以，你必须这样做

$active-color: #0074D9;
$opacity: 0.5;
$sec-color: rgb(255 - $opacity*(255 - red($active-color)), 255 - $opacity*(255 - green($active-color)), 255 - $opacity*(255 - blue($active-color)));

如果只需要修改一个或两个RGB值，可以使用change_color（）函数，如

$secondary-color: change-color($active-color, $blue: 255 - $opacity*(255 - blue($active-color)), $green: 255 - $opacity*(255 - green($active-color)));

---

是的，这正是我需要的。谢谢你的精心设计，这正是我所需要的。感谢您的详细阐述。如果我理解GraphicsDesign.stackexchange.com上对您问题答案的评论中的澄清，则对于非白色基色（例如绿色页面背景），可以将“第一项”（255）概括为“不透明度*颜色值”。对于简化为255的白色页面。如果我理解GraphicsDesign.stackexchange.com中关于您问题答案的评论中的澄清，对于非白色基色（例如绿色页面背景），可以将“第一项”（255）概括为“不透明度*颜色值”。对于简化为255的白色页面。