math - Mixing two colors "naturally" in javascript

Question

The problem: I want to mix two colors in javascript, and get the result color. There are a lot of similar question on SO, however I doesn't find anything that actually works correctly. I know that mixing two different colored paints(pigments) and lights will give very different results (http://en.wikipedia.org/wiki/Color_mixing).

Here are the questions and suggested solutions I've already seen, and tried to implement:

1: Mixing two RGB color vectors to get resultant
So, mixing colors in RGB. I implemented it, and in some cases it works in some cases it doesn't.

Working example: Mixing red with yellow -> orange. Great!
http://jsbin.com/afomim/1/edit

Not working example: Mixing blue with yellow -> gray. Not so great! :) http://jsbin.com/afomim/5/edit
I know that in RGB mixing blue with yellow will never make green, and I understand why.

We will not find the answer here, let's go forward.

2: Adding Colours (Colors) Together like Paint (Blue + Yellow = Green, etc)

Let's try to work with CMYK values as suggested in this discussion. Mixing cyan with yellow gives green:
http://jsbin.com/igaveg/1/edit
but mixing blue with yellow results in black.
http://jsbin.com/igaveg/2/edit -> Not working!

3: How to mix colors "naturally" with C#?
A very similar question. The most upvoted answer suggests to convert colors to LAB, and this solution seems promising.
So I converted my colors to LAB. The conversion algo is correct, I tested it!

http://jsbin.com/oxefox/1/edit

Now I have the two colors in LAB, but how to mix them?

NOTE I know that probably I will not find an algo that mixes blue with yellow and will give the perfect green, but I hope I can generate something similar to green :)

Answer 1

I dedicated 3-4 days to this question. It's a really complex problem.

Here is what you can do if you want to mix two colors "naturally":

1. CMYK mixing: it's not the perfect solution, but if you need a solution now, and you don't want to spend months with learning about the subject, experimenting and coding, you can check this out: https://github.com/AndreasSoiron/Color_mixer

2. Implementing the Kubelka-Munk theory. I spent a lot of time reading about it, and trying to understand it. This should be the way to go if you want a professional solution, but it needs 6 parameters (like reflectance, absorption, etc.) for each colors you want to mix. Having R, G, B isn't enough. Implementing the theory isn't hard, but getting those parameters you need about each color seems to be the missing part. If you figure it out how to do it, let me know :)

3. Experimental: you can do something what the developers of the ipad app: Paper have done. They manually selected 100 pairs of popular colors and eyeball-tested how they should blend. Learn more about it here.

I personally will implement the CMYK mixing for the moment, and maybe later, if I have time I'll try to make something like the guys at Fiftythree. Will see :)