OpenGL ES 如何实现符合Photoshop标准的RGB转HSV（非HSL）转换

符合Photoshop标准的RGB↔HSV GLSL实现 #

以下实现的输入输出RGB分量范围均为[0.0, 1.0]，输出HSV三个分量范围分别为：H（色相）[0.0, 1.0]（对应0~360°）、S（饱和度）[0.0, 1.0]、V（明度）[0.0, 1.0]，和Photoshop拾色器的HSV参数完全匹配。

RGB转HSV代码 #

vec3 convertRgbToHsv(vec3 c) {
    vec4 K = vec4(0.0, -1.0 / 3.0, 2.0 / 3.0, -1.0);
    // 排序获取RGB分量的最大值、最小值对应索引
    vec4 p = mix(vec4(c.bg, K.wz), vec4(c.gb, K.xy), step(c.b, c.g));
    vec4 q = mix(vec4(p.xyw, c.r), vec4(c.r, p.yzx), step(p.x, c.r));
    
    float maxVal = q.x;
    float minVal = min(q.w, q.y);
    float delta = maxVal - minVal;
    float e = 1.0e-10; // 避免除0错误
    
    // 色相H计算逻辑和HSL一致，饱和度S为delta/maxVal，明度V直接取RGB最大值
    return vec3(abs(q.z + (q.w - q.y) / (6.0 * delta + e)), delta / (maxVal + e), maxVal);
}

HSV转RGB代码 #

vec3 convertHsvToRgb(vec3 c) {
    vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);
    vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www);
    return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y);
}

和HSL实现的核心差异 #

你当前使用的HSL转换和HSV的核心区别仅在最后返回的S、V/L分量：

• HSL的亮度L为(maxVal + minVal) / 2.0，饱和度S为delta / (1.0 - abs(2.0 * maxVal - delta - 1.0) + e)
• HSV的明度V为RGB三个分量的最大值maxVal，饱和度S为delta / maxVal，完全符合Photoshop的HSV标准。

内容的提问来源于stack exchange，提问作者oHuflying