UTILS.
100% in-browser

Color Mixer

Blend two colors at an adjustable ratio and get the resulting hex value.

Drag the slider, then click the result to copy it.

About this tool

Color Mixer is a free, in-browser tool that blends two colors at an adjustable ratio and returns the resulting hex code. Pick a start color and an end color with the native color pickers, then drag the ratio slider from 0 to 100 percent to set how far the mix travels from the first color toward the second.

The blend is computed by interpolating each RGB channel linearly: at 0% the result equals the first color, at 100% it equals the second, and 50% is the exact midpoint. Values are calculated in 8-bit sRGB, rounded to whole channel levels, and shown live as both a large preview swatch and a copyable hex string as you move the slider or change either color.

Everything runs on your device — no uploads, no accounts, no tracking — and it works offline once the page has loaded. Use it to find a halfway tone between two brand colors, generate an intermediate step for a gradient, or preview what two colors produce when combined.

Frequently asked questions

How is the mix computed?
Each of the red, green, and blue channels is interpolated linearly between the two colors, weighted by the slider position, then rounded to the nearest 8-bit level. At 0% you get the first color and at 100% the second.
How do I copy the result?
Click the resulting hex value and it is copied to your clipboard.
What do the slider percentages mean?
The slider sets the blend ratio from 0 to 100 in whole-percent steps. 0% shows only the first color, 100% only the second, and 50% is an equal mix; the number is how far the result moves toward the second color.
Does it support transparency or other color formats?
No. The pickers use the native color input, so both colors are opaque 6-digit sRGB hex with no alpha channel, and the mix is done in gamma-encoded sRGB rather than linear-light space.

More tools