Design & Colour
Gradient Midpoint Calculator
Pick two hex colours to see the 50% midpoint mix.
What colour sits in the middle of a gradient?
Two-stop gradients sometimes need a middle colour for smoother blends or CSS multi-stop control. Mix two HEX colours at 50% in RGB space to get a midpoint you can paste as a third stop or a flat fill between brand tones. RGB midpoints are simple and match how many design tools blend channels; they are not the same as a perceptual midpoint in Lab or OKLCH. Build full linear-gradient strings with the gradient generator, and inspect single hues via HEX converter.
Worked example
#2A6F97 mixed 50/50 with #E9C46A → midpoint hex shown between the two swatches.
Limits and assumptions
Equal RGB mix only (t = 0.5). No angle, opacity or multi-stop editor.
Frequently asked questions
What is an RGB mix?
Each red, green and blue channel is averaged between the two colours. The result is another HEX you can copy.
Is this the visual middle of a CSS gradient?
Often close for screen work; CSS (Cascading Style Sheets) interpolates in a chosen colour space that may differ slightly.
Can I mix at 25% instead?
This page is fixed at 50%. For other weights, mix manually or edit the gradient stops.
Transparent colours?
Enter opaque six-digit hex only.