如何从SASS中的基色获得所需的颜色 [英] How to get desired color from base color in SASS
问题描述
我想要一个基本颜色，并希望为我的网站建立动态的色调，因此切换主题变得容易改变颜色值。
I want to have one base color and want to built dynamic color palate for my website so it becomes as easy to switch themes as changing a color value.
SASS有这么多的帮助功能，我相信足够让我在那里。我面对的问题是为了从单一的基本颜色获得所需的颜色值，我应该使用什么函数（或函数的组合）与什么值。
SASS has so many helper function which I believe enough to get me there. The problem I am facing here is in order to get to desired color value from that single base color, what function (or combination of functions) with what value shall I use.
有这个惊人的工具 http://sassme.arc90.com/ ，可让您使用各种组合但是你又没有完全控制输出。
There is this amazing tool http://sassme.arc90.com/ , which lets you play with various combinations but again you don't have full control over output.
例如，如果我有一个基本颜色＃ffe202 ，我想输出 ffd202 我不知道该如何去做，我可以通过玩控件，但不是我想要的东西，有点接近。
For example If I have a base color #ffe202 and I want output of #ffd202 I am not sure how to go about it, I can get somewhat closer by playing with controls but not exactly what I desire.
底线是我想知道是否有任何工具，你输入你的基本颜色和所需的输出颜色，它给你组合的SASS帮助函数使用类似于 http://sassme.arc90.com/ 。
So bottom line is I was wondering if there is any tool where you input your base color and desired output color and it gives you combination of SASS helper functions to use similar to http://sassme.arc90.com/ .
推荐答案
没有严格的方法总是从给定的颜色获得特定的结果，但你可以选择 Sass的颜色函数，以获得所需的结果。
There's no strict way to always get a specific result from a given color, but you can just choose which of Sass's color functions you want to get the desired result.
在您的情况下，您想要的颜色只有与起始颜色不同的绿色值，因此您可以这样调整绿色：
In your case, your desired color just has a different green value from your starting color, so you can adjust the green thusly:
background-color: adjust-color($color, $green: -16);
adjust-color（） 只会更改绿色值。您可以使用正值或负值来增加或减少色调的量;我通过尝试和错误登陆-16。
adjust-color() will change just the green value. You can use positive or negative values to increase or decrease the amount of a hue; I landed on -16 through trial and error.
这篇关于如何从SASS中的基色获得所需的颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
