用HSL + GD替换色调？

我们正在与具有蓝色（#645591，#6B90CA和#7BC8EF）与一个用户选择的颜色，将取代所述第一蓝色值（碱）的三个音调基础图像的工作和将产生的额外两种颜色两个音调将被替代。用HSL + GD替换色调？

我发现this answer这是非常有效的，但问题是如何计算一种颜色和另一种颜色之间的差异，所以我可以在完全不同的颜色重用差异？

首先，我想我可以得到RGB差异，并将其添加到新的颜色，这是我天真的天真。

然后，经过一番研究，似乎HSL是要走的路，所以我计算了基本蓝色（第一个）和下两个值之间的差异，这样我就可以确定选择另一个值并添加区别，对吧？嗯......原来，这不：

下，电流尝试是独自离开的色调值，并添加初始差异的饱和度和光值，结果是相当不错的，但我不确定它是否适用于不同的颜色。

有没有办法保存色调，同时颜色变化？
HSL是否要走？
我有一种感觉，将它转换为灰度，然后从那里对它进行着色，这是否正确？

下面的代码，我用CSS来测试这个概念做到了，但是这些工具是PHP + GD。

<style> 
span{ 
    display: inline-block; 
    width: 100px; 
    height: 400px; 
    float: left; 
} 
.c1{ 
    background: #645591; 
    /* hsl(255, 26%, 45%) */ 
} 
.c2{ 
    background: #6B90CA; 
    /* hsl(217, 47%, 61%) */ 
} 
.c3{ 
    background: #7BC8EF; 
    /* hsl(200, 78%, 71%) */ 
} 
.r1{ 
    background: hsl(50, 35%, 24%); 
} 
.r2{ 
    background: hsl(12, 56%, 40%); 
} 
.r3{ 
    background: hsl(355, 87%, 50%); 
} 
/* Preserving the Hue values turns out to be pretty good */ 
.z1{ 
    background: hsl(355, 35%, 24%); 
} 
.z2{ 
    background: hsl(355, 56%, 40%); 
} 
.z3{ 
    background: hsl(355, 87%, 50%); 
} 
</style> 
<span class="c3"></span> 
<span class="c2"></span> 
<span class="c1"></span> 
<span style="width: 50px;"></span> 
<span class="r3"></span> 
<span class="r2"></span> 
<span class="r1"></span> 
<span style="width: 50px;"></span> 
<span class="z3"></span> 
<span class="z2"></span> 
<span class="z1"></span>

来源

2012-12-12 metrobalderas

在计算飞行中颜色1,2和3之间的差异真的有点意义吗？如果我看看你的原版，你就是这样做的：basecolor，basecolor稍微饱和一点，很暗，然后稍微饱和一点，也很暗。

为什么不直接使用每个转化相同的公式，让用户选择一个基色出给定的调色板

可以再挑说32种基础色为自己的测试并生成设置3色为他们每个人，看看它的工作效果。

如果这样做效果不好，那么，您可能希望谷歌对“颜色的感知”或类似的东西。对于所有颜色，我们都不会以同样的方式感知黑暗中的变化（如果我没有记错的话，还有其他特质）。

你可能也想考虑去所有的CSS或CSS + PHP或LessCss或CSS + Javascript。

来源

2012-12-12 06:12:34

感谢您的反馈。当然，我可以自己做一些测试，但是我正在寻找的是正确的方法。此外，图像可能会非常复杂，所以使用CSS，Less或Javascript不是一种选择，因为它们必须使用GD生成。 – metrobalderas

用HSL + GD替换色调？

回答

相关问题