Color Blender
Linearly mix two HEX colors at a 0–100% ratio and calculate the intermediate color.
How to use
- Set two colors and adjust the blend percentage.
Capabilities and scope
mixAmount represents movement toward the second color and the result is shown as HEX, preview, and CSS.
How it works
Each RGB channel is interpolated by the same ratio and normalized back to HEX.
Example
Mixing #000000 and #FFFFFF at 50% produces a middle gray.
Useful for
- Find transition colors between two design colors
Before you use it
- RGB interpolation differs from perceptually uniform Lab/LCH mixing.
Frequently asked questions
Is 50% the perceptual midpoint?
It is the numeric RGB midpoint, not necessarily the midpoint of perceived lightness.