Home / Color Tools / Color Mixer
Free online tool

Color Mixer

Mix two opaque colors by percentage. Inspect HEX, RGB, HSV and HSL, then copy the source colors, balance and result HEX.

Start using

What Color Mixer does

This tool mixes exactly two opaque RGB colors. Each source color has an advanced picker with synchronized HEX, RGB, HSV and HSL controls. The default pair is #2563EB and #F97316.

How the blend works

The mix balance ranges from 0% to 100% and defaults to 50%. It represents the proportion of the second color: 0% returns the first color, 100% returns the second, and values outside the range are clamped. Each gamma-encoded sRGB channel is interpolated independently using the formula result = first * (1 - k) + second * k, then rounded to the nearest byte for HEX output. This is not linear-light, perceptual Lab/OKLab or pigment mixing.

Worked example

Input

#2563EB and #F97316 at 50%

Result

Channel values 143, 107 and 128.5, rounded to HEX #8F6B81.

The exact midpoint can look different from a perceptual color-space blend.

Practical checklist

  • Verify the source colors in the format you intend to use.
  • Adjust the balance, then click Mix colors to recalculate the preview.
  • Copy all copies the source HEX codes, balance and result HEX. Select individual RGB or HSL field values manually if needed.
  • Remember that the generated output opens in an editable advanced color panel; manual edits there change the result color display, not the source colors or the balance.

Limitations

  • No alpha, transparency, gradient, multi-color recipe or physical paint behavior is calculated.
  • Processing is local to the browser; no entered color is uploaded.
  • Rounded conversions can differ by one channel unit when converted back and forth.

Frequently asked questions

Why does the blended result look different from what I expected?

The tool mixes in gamma-encoded sRGB space, which is not perceptually uniform. A 50% blend is numerically halfway in that model, but perceived brightness can differ because human vision is not linear.

Can I mix colors with transparency?

No, the tool only accepts opaque colors. Alpha values are not supported.

Does the tool send my colors to a server?

No, all color calculations run locally in your browser. Your colors are not uploaded.

Processing takes place locally in your browser.