Converting RGB to HSB Colors

Maybe you already look into this wikipedia article, but to make it clear.

There is a difference between HSL and HSB (aka HSV).

So you can’t take the (B)rightness from the color class and use it like a (L)uminosity.

To get back from the Color class provided values GetHue(), GetSaturation() and GetBrightness() to a normal color you should give this extension method a chance.

/// <summary>
/// Creates a Color from alpha, hue, saturation and brightness.
/// </summary>
/// <param name="alpha">The alpha channel value.</param>
/// <param name="hue">The hue value.</param>
/// <param name="saturation">The saturation value.</param>
/// <param name="brightness">The brightness value.</param>
/// <returns>A Color with the given values.</returns>
public static Color FromAhsb(int alpha, float hue, float saturation, float brightness)
{
    if (0 > alpha
        || 255 < alpha)
    {
        throw new ArgumentOutOfRangeException(
            "alpha",
            alpha,
            "Value must be within a range of 0 - 255.");
    }

    if (0f > hue
        || 360f < hue)
    {
        throw new ArgumentOutOfRangeException(
            "hue",
            hue,
            "Value must be within a range of 0 - 360.");
    }

    if (0f > saturation
        || 1f < saturation)
    {
        throw new ArgumentOutOfRangeException(
            "saturation",
            saturation,
            "Value must be within a range of 0 - 1.");
    }

    if (0f > brightness
        || 1f < brightness)
    {
        throw new ArgumentOutOfRangeException(
            "brightness",
            brightness,
            "Value must be within a range of 0 - 1.");
    }

    if (0 == saturation)
    {
        return Color.FromArgb(
                            alpha,
                            Convert.ToInt32(brightness * 255),
                            Convert.ToInt32(brightness * 255),
                            Convert.ToInt32(brightness * 255));
    }

    float fMax, fMid, fMin;
    int iSextant, iMax, iMid, iMin;

    if (0.5 < brightness)
    {
        fMax = brightness - (brightness * saturation) + saturation;
        fMin = brightness + (brightness * saturation) - saturation;
    }
    else
    {
        fMax = brightness + (brightness * saturation);
        fMin = brightness - (brightness * saturation);
    }

    iSextant = (int)Math.Floor(hue / 60f);
    if (300f <= hue)
    {
        hue -= 360f;
    }

    hue /= 60f;
    hue -= 2f * (float)Math.Floor(((iSextant + 1f) % 6f) / 2f);
    if (0 == iSextant % 2)
    {
        fMid = (hue * (fMax - fMin)) + fMin;
    }
    else
    {
        fMid = fMin - (hue * (fMax - fMin));
    }

    iMax = Convert.ToInt32(fMax * 255);
    iMid = Convert.ToInt32(fMid * 255);
    iMin = Convert.ToInt32(fMin * 255);

    switch (iSextant)
    {
        case 1:
            return Color.FromArgb(alpha, iMid, iMax, iMin);
        case 2:
            return Color.FromArgb(alpha, iMin, iMax, iMid);
        case 3:
            return Color.FromArgb(alpha, iMin, iMid, iMax);
        case 4:
            return Color.FromArgb(alpha, iMid, iMin, iMax);
        case 5:
            return Color.FromArgb(alpha, iMax, iMin, iMid);
        default:
            return Color.FromArgb(alpha, iMax, iMid, iMin);
    }
}

Update

So just to make things clear. My code above and the three methods within the Color class mentioned above are using the HSB (aka HSV) color model, but Photoshop uses the HSL color model.

In your comment you wrote that the parameters Hue = 0, Saturation = 1 and Brightness = 1 give you with the code above a red color and white in Photoshop. When you take a closer look at the differences of these modes this makes absolutely sense:

The HSL cylinder

HSL cylinder
(source: wikimedia.org)

  • In both models the hue acts as the same by using color Red as start and end point (zero and 360 degree).
    • By just looking at the hue you’ve got a red color.
  • The saturation defines how opaque the color is or how much the portion of a whitescale is.
    • So by setting it to one you say you want a full shiny red color.
  • The lighting now defines how much is the black and white part within your color. By setting it to zero you got black, one means white and 0.5 means perfect weighting.
    • So by setting it to one you say you want it as bright as possible which result in a white color.

The HSB cylinder

HSB cylinder
(source: wikimedia.org)

  • In both models the hue acts as the same by using color Red as start and end point (zero and 360 degree).
    • By just looking at the hue you’ve got a red color.
  • The saturation defines how opaque the color is or how much the portion of a whitescale is.
    • So by setting it to one you say you want a full shiny red color.
  • The brightness (or value) now defines how much is the black part within the color (not the white part).
    • So by setting it to one you say you want it full colored leading to a full shiny red color.

As you can see, Photoshop and the .Net framework (including my extension function) are using different coloring models. So you should check if you find somewhere an implementation of the other coloring model, a transformation or something else that gives you the results you need.

Leave a Comment