What color do blue and brown make?
Mixed as paint, blue and brown make a muted green. Change the ratio, switch to light or CSS mixing, and copy the result.
Blue and brown make muted green
Mixed as paint, blue and brown make a muted green (#385244). As light on a screen, they make a purple (#7E6ADB), and blended in CSS with OKLCH they give a magenta (#8E3278).
muted green
#385244
As paint
Pigments absorb light, so every color you add takes some away. This is what you get on a palette or canvas.
purple
#7E6ADB
As light
Colored lights add up, as on a screen or stage. Mixes get brighter, not darker.
magenta
#8E3278
In CSS (OKLCH)
What color-mix(in oklch, …) returns for an even mix in the browser.
Mixing blue and brown in different ratios
The ratio decides which color leads. These are paint mixes, measured in equal-sized parts.
3:1 · #26555E
3 blue : 1 brown, muted teal
2:1 · #2D5453
2 blue : 1 brown, muted teal
1:1 · #385244
1 blue : 1 brown, muted green
1:2 · #44503A
1 blue : 2 brown, olive
1:3 · #4B4E36
1 blue : 3 brown, olive
Making the mix lighter or darker
Add white for tints and black for shades. Each step adds 20% more of it to the even blue and brown mix.
With white
#698979
20%
#89A798
40%
#A5BEB1
60%
#C2D4CB
80%
With black
#35483E
20%
#303E37
40%
#29312D
60%
#1E211F
80%
Need a full scale for a UI instead? The shade generator builds evenly spaced, accessible shades from any color.
More mixes with blue
More mixes with brown
Mixing blue and brown FAQ
Mixed as paint, blue and brown make a muted green (#385244). As light on a screen, they make a purple (#7E6ADB), and blended in CSS with OKLCH they give a magenta (#8E3278).
Light adds up instead of absorbing, so blue and brown light make a purple (#7E6ADB). That is why screens can show bright yellows from red and green light, while the same paints would turn brown.
Change the ratio. Three parts blue to one part brown gives a muted teal (#26555E), while one part blue to three parts brown gives an olive (#4B4E36). To lighten the result add white, and to darken it add a little black.
Use color-mix(in oklch, #1D4ED8 50%, #7B4A2A 50%), which gives #8E3278. OKLCH keeps the middle of the mix bright, while mixing in sRGB tends to turn it gray.