graphicscolorsrgbmixing

Calculation of a mixed color in RGB


I want to be able to take two RGB-256 vectors and calculate the result of their mixture. Also I want to be able to give each vector a different weight. I've experimented with it using the Word color plate, and I've seen that while some colors do mix according to a weighted average:

0.5*red(255,0,0) + 0.5*yellow(255,255,0) = orange(255,127,0)

others don't:

0.5*yellow(255,255,0) + 0.5*blue(0,0,255) = gray (127,127,127) and not green (0,255,0)

Is there an algorithm for accurate calculation for all colors or am I forced to do it using a look up table?


Solution

  • The best explanation is that the RGB color model is somewhat unintuitive for us humans.
    It's perfectly logical for a video display device (such as a monitor or television) that only knows how to display colors by mixing varying amounts of 3 pre-defined colors: red, green, and blue. But that's not how you and I learned to mix colors in grade school.

    In RGB, the color white is represented as (255, 255, 255), which equates to "all on." The full value for each of the red, green, and blue color components is displayed, which creates such a high light intensity that we perceive the color as white. Conversely, the color black (0, 0, 0) is the "default" state of the display device—when no color light is displayed ("0"), the result is black, or the absence of color.

    When you fully mix yellow (255, 255, 0) and blue (0, 0, 255), you get the color represented by (255, 255, 255), or white. When you multiply white by 0.5, you get a gray color, because 255 * 0.5 = 127.

    It's probably more of an anomaly than anything that you get the expected result when mixing red and yellow. Red + yellow is (510, 255, 0), so when you multiply that by 0.5, you get orange (255, 127, 0).

    It turns out that what you and I learned in grade school is really more accurately known as a subtractive color model, versus the additive color model used by RGB. Looking at the two diagrams at the bottom, you'll see the RGB color model (additive) on the left, versus the CMYK color model (subtractive) on the right. You should be able to immediately see the problem. Using a subtractive color model instead will produce the results that you want.

             RGB Color Model                                 CMYK Color Model

    EDIT: Of course, that's easier said than done. That is, even if you adopt the CMYK color model instead of RGB (which is already difficult, because conversions from RGB to CMYK are heavily device-dependent and far from straightforward), this will probably still not satisfy the urge to mix pure blue (0, 0, 255) with pure yellow (255, 255, 0) and get green. CMYK uses cyan, magenta, and yellow as the 3 primary colors, instead of red, yellow, and blue. And you have a lot of work ahead of you if you want to go about implementing the RYB color model in the language of your choice.

    I don't know of any such algorithm to combine RGB colors realistically. I was attempting in my answer to explain why it would be impossible, or extremely difficult at the very least. You could leave this question open a few more days and see if anyone else has any ideas, but I'd go ahead and start on that look-up table if you need to stick with the RGB model. ;-)