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, #3A47D5)Nearest descriptive name from Color Name List; not an exact color identity.
Save a mix to keep its colors, ratio, and method here.
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.