🖌️Two Color Blend Generator

Midpoints computed in sRGB and in linear light, side by side

%

You Might Also Need

Why the midpoint is not a single answer

The midpoint between two colors depends on the space you mix in. Rather than quietly picking one, this tool shows the result of mixing the gamma-encoded sRGB values directly alongside the result of converting to light amount, mixing, and encoding back. Change the weight, then scan the step table, and you can see exactly where the two approaches diverge most.

Both methods interpolate per channel as A plus B minus A, times the weight. The linear-light path linearizes first using the same formula as the W3C WCAG and CSS Color specifications, mixes, and re-encodes. The linearization threshold is 0.04045, and the slope and exponent appear in the result alongside it. Mix red and blue half and half and sRGB gives a dark purple while linear light gives a noticeably brighter one. This reflects October 2026.

Neither result is declared correct. To match the midpoint your design tool shows, the sRGB figure is closer; to imitate how light mixes, the linear figure is. Building a scale from one color by mixing in white for tints or black for shades is not supported here and is handled by the stepped palette tools.

Frequently asked questions

Why are there two results?

HEX values are gamma encoded, so averaging them directly is not the same as averaging the amount of light. Neither answer is the correct one, so both the gamma-encoded blend and the linear-light blend are shown.

Which one should I use?

To match the midpoint a design tool or a CSS gradient produces, the sRGB blend is closer. To imitate how light actually mixes, or for lighting and compositing math, the linear-light blend is the right one.

Can it build a tint or shade scale from one color?

This tool blends any two colors. Mixing with white for tints, with black for shades and with gray for tones is the job of the Simplewoody stepped palette tools.