TTULAKITO
Designer

Color Mixer

Blend two colors with adjustable ratio and copy the mix.

All tools

Color mixer

Mixed: #828a3d
A: #0f766e
B: #f59e0b

Frequently asked questions

How do I mix two colors in CSS?
Modern CSS has color-mix(in srgb, #ff0000 50%, #0000ff), which blends two colors in a chosen color space. Before color-mix, designers manually averaged RGB channels or relied on preprocessors like Sass.
Why does mixing red and green give muddy brown instead of yellow?
RGB mixes additively like light, so red plus green light makes yellow, but most tools mix in averaged RGB which behaves more like paint. Mixing in OKLCH or LCH produces results closer to what designers expect.
What's a good ratio for accent color mixing?
For hover states, mix the base color with 10-15% white or black. For disabled states, mix 50-60% with the background color so the element fades without losing its identity completely.