标签: hsl

我在http://www.mjijackson.com/2008/02/rgb-to-hsl-and-rgb-to-hsv-color-model-conversion-algorithms-in-javascript上找到了这个RGB到HSL脚本.我找不到任何其他小的体面的.问题是这段代码甚至不起作用.有谁知道为什么？(我不知道一点颜色数学,但也许它正在返回补充？)

function rgbToHsl(r, g, b){
    r /= 255, g /= 255, b /= 255;
    var max = Math.max(r, g, b), min = Math.min(r, g, b);
    var h, s, l = (max + min) / 2;

    if(max == min){
        h = s = 0; // achromatic
    }else{
        var d = max - min;
        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
        switch(max){
            case r: h = (g - …

我可以将HSB颜色转换为HSL吗？

Photoshop在其颜色选择器中显示HSB颜色.HSL颜色可以在CSS中使用.

我试过这个JS:

function hsb2hsl(h, s, b) {
  return {
    h: h,
    s: s,
    l: b-s/2
  }
}

而hsb2hsl(0, 100, 50).l == 0不是25

更新:如果不转换HSB→RGB→HSL,我可以这样做吗？

有谁知道调整图层在Photoshop中是如何工作的？我需要从Hue/Saturation调整图层生成具有源图像和HSL值的结果图像.转换为RGB然后与源颜色相乘不起作用.

或者是否可以使用适当设置的混合模式(多重,屏幕,色调,饱和度,颜色,亮度......)将Hue /饱和度调整图层替换为普通图层？如果是这样呢？

谢谢

通过阅读HSL/HSV色彩理论,我得到的印象是色调分量是一个循环属性,每360度重复一次,并且可以独立于饱和度和亮度/值进行更改.如果我错了,请纠正我,但这些陈述逻辑上遵循先前的定义:

1. 旋转色调360度产生相同的颜色
2. 将色调旋转180度两次产生原始颜色
3. 将色调旋转180度,然后旋转-180度,得到原始颜色

但是,只有选项1是正确的.旋转色调4次+90度会产生与原始颜色甚至不相似的颜色.

此外,使用-webkit-filter和SVG

<filter><feColorMatrix in="SourceGraphic" type="hueRotate" values="..." /></filter>

不要为相同的旋转产生相同的结果.另一方面,SVG过滤器生成的颜色在浏览器中是一致的.

是否存在色调旋转的"隐藏"属性,使操作不相关？

webkit过滤器和SVG的示例可以在这里找到:http://jsfiddle.net/maros_urbanec/ARsjb/5/

据我所知,HSL和HSB颜色空间非常相似,两者都使用相同的0-360色轮作为色调,并使用相同的0-1值进行饱和.它们之间的一个区别是在HSB模型中你有亮度,其中0是黑色,1是全强度的颜色,而在HSL中你有亮度/亮度,其中0仍然是黑色但1是白色.

在.NET Color结构采用RGB空间,但GetHue(),GetSaturation()和GetBrightness()功能.

这里的文档令人困惑.用于GetBrightness():

/// <summary>Gets the hue-saturation-brightness (HSB) brightness value for this 
/// System.Drawing.Color structure.</summary>

好吧,这很有意义,.Net似乎正在使用HSB ......

/// <returns>The brightness of this System.Drawing.Color. The brightness ranges 
/// from 0.0 through 1.0, where 0.0 represents black and 1.0 represents white.
/// </returns>

呃......所以最大值代表白色,而不是最亮的颜色.尽管他们的文档和命名始终指的是亮度,但我很确定返回的值实际上是亮度/亮度,即.Net实际上使用HSL模型而不是HSB.

谁能证实这一点？它是文档中的错误GetBrightness(),错误,还是我以某种方式误解了理论？

我正在尝试将RGB转换为HSL,我也希望从HSL转换为RGB,我已经为它编写了一个类但是如果我做RGB-> HSL-> RGB来尝试它是否有效我会得到一个不同的值.

示例案例: 如果您通过执行创建HSLColor对象HSLColor MyTestConversion = HSLColor.FromRGB(Colors.Green); ,然后 Color ExpectedGreenHere = MyTestConversion.ToRGB()获得Colors.Green与原始输入不同的颜色,那么出现问题.

这是我正在使用的代码:

public class HSLColor
{
    public float Hue;
    public float Saturation;
    public float Luminosity;

    public HSLColor(float H, float S, float L)
    {
        Hue = H;
        Saturation = S;
        Luminosity = L;
    }

    public static HSLColor FromRGB(Color Clr)
    {
        return FromRGB(Clr.R, Clr.G, Clr.B);
    }

    public static HSLColor FromRGB(Byte R, Byte G, Byte B)
    {
        float _R = (R / 255f);
        float _G = (G …

Google maps api v3允许将"样式"应用于地图,包括设置各种功能的颜色.但是,它使用的颜色格式是HSL(或者看起来像它):

• 色调(RGB十六进制字符串)
• 亮度(-100到100之间的浮点值)
• 饱和度(-100到100之间的浮点值)

(来自文档)

我设法在线找到RGB到HSL转换器,但我不确定如何以谷歌地图将接受的方式指定转换后的值.例如,转换器给出的典型HSL值为:209° 72% 49%

HSL值如何映射到我从google maps api指定的参数？也就是说,色调度值如何映射到RGB十六进制字符串？百分比如何映射到-100到100之间的浮点值？

我仍然不确定如何进行转换.我需要,给定一个RGB值,快速将其转换为谷歌地图所期望的,以便颜色相同......

我正在尝试使用ColorMatrix为整个图像设置一个恒定的色调值.我的目标是使整个图像看起来具有相同的颜色,而不会失去任何区域的亮度.我找到了一种通过使用ColorMatrix来移动图像的色调值的方法,但我找不到任何方法来为所有像素设置相同的色调值.我可以通过迭代图像的每个像素来做到这一点,但这种方法太慢了.我不确定是否可以使用ColorMatrix进行此操作,并且我对除ColorMatrix方法之外的可能解决方案持开放态度.

输入图像

色调变换输出图像*

期望的输出图像**

*这可以用彩色矩阵完成

**我可以通过迭代像素来实现这一点,但不能使用ColorMatrix

PS:我试图在Android上做这个,但我相信这个问题与android没有直接关系,因为ColorMatrix方法在Flash,C#等其他平台上很常见.

在CSS3规范只规定:

功能表示法中HSLA颜色值的格式为'hsla('后跟色调为度,饱和度和亮度为百分比,a,后跟')'.

那么我是否理解这些值不会被解释为整数而是浮点数？例:

hsla(200.2, 90.5%, 10.2%, .2)

这将极大地扩展HSL覆盖的其他小(相对于RGB)颜色范围.

它似乎在Chrome中呈现良好,但我不知道它们是否只是将其解析为INT值或什么.

我正在尝试使用CSS过滤器模拟Photoshop的"颜色叠加",同时这样做,发现CSS过滤器对颜色的操作与癫痫发作一致.

考虑一下颜色#FF0000.如果我们旋转它的色调120deg,我们应该得到#00FF00,并且240deg我们应该得到#0000FF.这是理智的领域.现在让我们进入CSS过滤器:

body { font: bold 99px Arial }
span { color: #F00; }
.daltonics-wont-notice {
    -webkit-filter: hue-rotate(120deg);
    filter: hue-rotate(120deg);
}
.precision-is-overrated {
    -webkit-filter: hue-rotate(240deg);
    filter: hue-rotate(240deg);
}

<span class="red">?</span>
<span class="daltonics-wont-notice">?</span>
<span class="precision-is-overrated">?</span>

什么应该#00FF00是#007100,而且应该是什么#0000FF是#0132FF.通过使用hue-rotate,色调,饱和度和亮度已设置为无意义的级别,跨浏览器.

我需要赶上Cthulhu并找出他编码的逻辑,以便我可以解决它.

这是一个与HSV或HSL无关的奇怪色彩空间吗？是否有可能将HSV,HSL或RGB坐标转换为这种异想天开的维度？它有名字吗？一个标准？邪教跟随？