Matt
Matt

Reputation: 27001

Is there an easy way to blend two System.Drawing.Color values?

Is there an easy way to blend two System.Drawing.Color values? Or do I have to write my own method to take in two colors and combine them?

If I do, how might one go about that?

Upvotes: 24

Views: 21153

Answers (4)

Oliver
Oliver

Reputation: 45119

To combine two colors by using alpha blending the following method can be taken:

private const float Divisor = byte.MaxValue;

public static Color AlphaBlend(this Color backColor, Color foreColor)
{
    var fa = foreColor.A / Divisor;
    var fr = foreColor.R / Divisor;
    var fg = foreColor.G / Divisor;
    var fb = foreColor.B / Divisor;

    var ba = backColor.A / Divisor;
    var br = backColor.R / Divisor;
    var bg = backColor.G / Divisor;
    var bb = backColor.B / Divisor;

    var a = fa + ba - fa * ba;

    if (a <= 0)
        return Color.Transparent;

    var r = (fa * (1 - ba) * fr + fa * ba * fa + (1 - fa) * ba * br) / a;
    var g = (fa * (1 - ba) * fg + fa * ba * fa + (1 - fa) * ba * bg) / a;
    var b = (fa * (1 - ba) * fb + fa * ba * fa + (1 - fa) * ba * bb) / a;

    return Color.FromArgb(
        (int)(a * byte.MaxValue),
        (int)(r * byte.MaxValue),
        (int)(g * byte.MaxValue),
        (int)(b * byte.MaxValue));
}

Upvotes: 0

Timwi
Timwi

Reputation: 66604

I wrote a utility method for exactly this purpose. :)

/// <summary>Blends the specified colors together.</summary>
/// <param name="color">Color to blend onto the background color.</param>
/// <param name="backColor">Color to blend the other color onto.</param>
/// <param name="amount">How much of <paramref name="color"/> to keep,
/// “on top of” <paramref name="backColor"/>.</param>
/// <returns>The blended colors.</returns>
public static Color Blend(this Color color, Color backColor, double amount)
{
    byte r = (byte) (color.R * amount + backColor.R * (1 - amount));
    byte g = (byte) (color.G * amount + backColor.G * (1 - amount));
    byte b = (byte) (color.B * amount + backColor.B * (1 - amount));
    return Color.FromRgb(r, g, b);
}

Upvotes: 45

Gazgoh
Gazgoh

Reputation: 1

I think its easier to blend an array of colors, in case you want to blend more then 2 Here is my function:

private Color colorBlend(List<Color> clrArr)
{   
    int r = 0;
    int g = 0;
    int b = 0;
    foreach(Color color in clrArr)
    {
        r += color.R;
        g += color.G;
        b += color.B;
    }
    r = r / clrArr.Count;
    g = g / clrArr.Count;
    b = b / clrArr.Count;
    return Color.FromArgb(r, g, b);
}

The array must be as a List of color Use :

List<Color> colorList = new List<Color>();
colorList.Add(Color.Red);
colorList.Add(Color.Blue);
picturebox.backColor = colorBlend(colorList);

Upvotes: 0

Drew Noakes
Drew Noakes

Reputation: 311275

If you want to blend colours in a way that looks more natural to the human eye, you should consider working in a different colour space to RGB, such as L*a*b*, HSL, HSB.

There a great code project article on colour spaces with examples in C#.

You may like to work with L*a*b*, as it was designed to linearise the perception of color differences and should therefore produce elegant gradients.

Upvotes: 7

Related Questions