Ad Space — Top Banner

Color Mixer Calculator (Hex / RGB)

Mix two hex colors and find the resulting hex code and RGB values.
Enter two colors and a mix ratio to calculate the blended color for design and web projects.

Blended Color

Mixing colors digitally is straightforward: blend the red, green, and blue channels separately, weighted by the mix ratio. This is additive color mixing, the model used by screens, web design, and digital art.

For a 50/50 mix of two colors:

R_result = (R1 + R2) / 2 G_result = (G1 + G2) / 2 B_result = (B1 + B2) / 2

For a weighted blend (where mix = percentage of Color 1):

R_result = R1 x (mix/100) + R2 x (1 - mix/100) G_result = G1 x (mix/100) + G2 x (1 - mix/100) B_result = B1 x (mix/100) + B2 x (1 - mix/100)

Hex colors are just a compact representation of RGB. The hex code #FF5733 breaks down as: R=255 (FF), G=87 (57), B=51 (33). Each pair of hex digits is a number from 0-255.

A few mixing surprises worth knowing. Mixing red (#FF0000) and blue (#0000FF) at 50/50 gives #7F007F — a dark purple. If you expected a bright purple, that is because digital purple (#FF00FF) requires maximum red and maximum blue simultaneously, which cannot come from halving both. This is also why mixing two saturated colors almost always produces a darker, murkier result — the averaged channels reduce brightness.

CMYK (printers) and RGB (screens) mix differently. This calculator uses RGB/hex, which is the standard for web and digital design. For physical paint or ink mixing, CMYK or subtractive pigment models give more accurate predictions.

Enter hex colors with or without the # symbol (e.g., FF5733 or #FF5733).


Ad Space — Bottom Banner

Embed This Calculator

Copy the code below and paste it into your website or blog.
The calculator will work directly on your page.