Color Mixing
A color mixer that blends colors the way they really combine. Choose realistic paint mixing (so blue and yellow make green, just like on a palette), additive light, subtractive ink, a perceptual blend, or a plain RGB average — and compare all five at once. Mix two or more colors in any ratio, read the result in HEX, RGB, HSL, CMYK and OKLCH, build a gradient, check contrast, and even reverse-engineer a paint recipe from real artist tubes.
How to mix colors
Paint for real pigments, light for screens, or blend for a smooth midpoint.
Type a code, use the picker or the eyedropper, then set how much of each.
See the mixed color and copy it in HEX, RGB, HSL, CMYK or OKLCH.
Check the five-model comparison, the gradient and the contrast readout.
Blend paint, light or digital colors and get the true result
Mixing model
Colors
Side by side: every model
The same colors mixed five ways. Notice that paint gives green, light gives white and a plain RGB average gives grey — this is why most mixers feel “wrong”. Tap a card to switch.
Blend steps
A stepped gradient between your colors, using the active model. Click any step to copy its code.
Accessibility of the result
WCAG contrast of the mixed color and how it looks to people with color-vision deficiency.
Reverse: find a paint recipe
Pick a target color and we search real artist tubes for the closest two-pigment mix — with the ratio to use.
Popular color mixes
Tap a pair to load it into the mixer and see the result.
What makes it different
Common uses
- See what color two paints make before mixing them for real.
- Find the ratio of two tubes that matches a target shade.
- Build a smooth gradient between brand colors for a design.
- Understand why blue + yellow is green in paint but white in light.
- Check that a mixed color stays readable and color-blind friendly.
Why this mixer
Almost every online color mixer just averages RGB values, so blue and yellow come out grey — nothing like real paint. This tool uses the Kubelka–Munk pigment model (via the open-source spectral.js engine) to mix colors through their light absorption and scattering, the way pigments actually behave, so blue + yellow gives a believable green. It is honest about the other models too: light mixing is additive, ink is subtractive, the perceptual blend is for gradients, and the plain RGB average is shown only to demonstrate the common mistake. The mixing math runs in your browser via WebAssembly.
Frequently asked questions
What color do blue and yellow make?
In paint, blue and yellow make green — that is what the default “Paint” model shows here, because real pigments mix by absorbing light. With light (additive), blue and yellow instead make white. A naive RGB average gives grey, which is why so many other mixers look wrong.
What color do red and blue make?
Mixed as paint, red and blue make purple (leaning to a deep violet or maroon depending on the exact reds and blues). As light, red and blue make magenta.
What two colors make brown?
Brown comes from mixing complementary colors — for example red + green, or orange + blue, or all three primaries together. Try the “Red + Green” chip below to see it.
Why is this different from other color mixers?
Most tools average RGB channels, which is physically wrong for paint. This one offers a realistic pigment model (Kubelka–Munk) as the default, so the results match what happens on an actual palette, and it shows all the other models side by side.
Can I mix more than two colors?
Yes — add up to six colors and set the amount of each with a slider or an exact percentage.
Is the paint result perfectly accurate?
It is physically plausible, not lab-exact. Converting a screen color to a pigment is an estimate, and real tubes vary in strength, so treat the result and the reverse recipe as an excellent starting point.
What is the reverse recipe?
Enter any target color and the tool searches a set of real artist tubes for the closest two-pigment mix, then tells you the ratio and how close the match is (ΔE).
Does it work on mobile?
Yes. The eyedropper needs a Chromium browser (Chrome, Edge); everywhere else you can use the native color picker.
