Color Mixer
Color Mixer interpolate two screen colors blend hex values by percent digital color midpoint- HEX
- #808080
- RGB
- rgb(128, 128, 128)
- HSL
- hsl(0, 0%, 50.2%)
Choose how much of Color B enters the mix
Type or paste two opaque sRGB colors, or choose them with the color pickers, then adjust the Color B percentage. Zero percent returns Color A, 100% returns Color B, and 50% gives their encoded RGB midpoint. Select Mix colors or press Enter, then copy the HEX, RGB, or HSL result.
Exact interpolation method
This tool linearly interpolates the displayed 8-bit sRGB channel numbers. For each red, green, and blue channel, it calculates A × (1 − p) + B × p, where p is the Color B percentage divided by 100, then rounds to the nearest integer. It mixes encoded channel values directly; it does not first convert them to linear light.
Worked example
Mix #ff0000 as Color A with #0000ff as Color B at 25%. Red becomes 255 × 0.75 + 0 × 0.25 = 191.25, rounded to 191. Green stays 0. Blue becomes 0 × 0.75 + 255 × 0.25 = 63.75, rounded to 64. The mixed result is #bf0040 or rgb(191, 0, 64).
Why the midpoint may look unexpected
Encoded sRGB mixing is common in simple digital controls, but its numeric midpoint is not a perceptually even midpoint and is generally darker than linear-light interpolation. Different graphics apps, gradient engines, and color libraries may use other spaces or hue rules. Record the method when a precise design handoff needs reproducible results.
Useful ways to apply a mix
A small percentage can soften an accent toward a background, create a quick border color, or explore intermediate states. Endpoint colors remain available at 0% and 100%. Before using a mixed color for text, icons, focus rings, or controls, check it against its actual background rather than assuming two suitable endpoints make every intermediate suitable.
Limitations and privacy
Mixing happens locally in this browser. Scope is digital RGB channel mixing for opaque sRGB colors. It does not model physical paint or pigment, subtractive mixing, alpha compositing, light emission, spectral response, linear-light blending, or perceptual color spaces such as OKLab. It also does not manage ICC profiles, wide gamut, HDR, or print reproduction.
Color Mixer FAQ
Is 50% always the visual halfway point?
No. It is halfway between encoded channel numbers, not necessarily halfway in perceived brightness or color difference.
Why are channel results rounded?
Output is limited to standard 8-bit sRGB integers from 0 through 255.
Does this behave like mixing paint?
No. Paint depends on pigments, concentration, medium, and reflected wavelengths.