Loading...

Color Mixer

Blend any two colors together. Drag the slider to pick the perfect mix ratio and copy the result in HEX, RGB, or HSL.

Color A (100%)50% A / 50% BColor B (100%)
0255075100

Mixed Result

HEX#9A7B86
RGBrgb(154, 123, 134)
HSLhsl(339, 13%, 54%)

Blend Scale

0%#3B82F6
10%#4E81E0
25%#6B7EBE
50%#9A7B86
75%#CA774E
90%#E6752C
100%#F97316

How Color Mixing Works

Linear RGB blending

Each color channel (red, green, blue) is interpolated independently. At 50% mix, each channel is exactly halfway between the two source values, giving a perceptually smooth result.

When to use this

Use the color mixer to find midpoint tones, build gradient palettes, test how two brand colors combine, or derive new shades that bridge two different hues harmoniously.

Blend scale

The blend scale shows fixed stops at 0%, 10%, 25%, 50%, 75%, 90%, and 100%. Click any swatch to copy its hex code. These steps work great as a custom gradient or a tonal ramp.

Tips

To mix a color with white (#FFFFFF) or black (#000000), set one input to that value — this gives you tints and shades. Try mixing complementary colors at 50% to find their neutral midpoint.