m.
Brand markShape + contrastColor blending lab
Pick two colors and set the balance between them. Compare screen, light-corrected, hue, OKLCH, and paint-style mixing, then copy the exact result.
Starting colors
Blends RGB values directly, like most design tools.
Enter a 3- or 6-digit HEX code, or tap a color field.
Live result
50% A + 50% B · Screen
--mixed-color: #9D4980;linear-gradient(90deg, #FF4B2B, #9D4980, #3A47D5)Method check
Tap a card to use that mixing method in the main result.
Save a mix to keep its colors, ratio, and method here.
Color path
Test drive
See the same mix as a brand mark, interface accent, and poster color.
Next up
Color mixer guide
An online color mixer shows what happens when two colors share the same space. Instead of guessing between HEX codes, you can set exact inputs, move the balance, and compare several mixing methods. The result can become a UI accent, brand color, illustration tone, or one stop in a larger palette.
Need more range? Browse lighter and darker color shades, compare named colors, or explore the CSS color categories.