How to use
- Set the first and second colors with the pickers or paste a supported color value.
- Choose how much of color B to blend into color A.
- Copy the mixed result into Gradient Generator, CSS Color Mix, Color Converter, or your spec sheet, depending on the next decision.
Wave 44 expansion
Test an in-between color before you commit the palette
This page sits between color picking and format conversion. It helps when two approved swatches still need a midpoint candidate.
How to choose between nearby pages
Use Color Picker first when you still need to browse single swatches. Use this page when two known colors need an in-between candidate. Move to Color Palette Generator when the mixed result now needs supporting lighter, darker, or accent options. Move to Color Scale Generator when the approved result now needs an ordered light-to-dark scale for UI tokens. Move to Gradient Generator when those approved colors now need a background-ready linear or radial CSS gradient. Move to CSS Color Mix when the two approved colors now need a ready-to-paste color-mix() expression for code or token docs. Move to Color Converter when the approved mixed result must be shared in another notation, and move to Contrast Checker when the real question is pass/fail readability for a final foreground/background pair.
FAQ
What does this page do?
It blends two colors by ratio and shows the mixed result in HEX, RGB, HSL, and a matching common color keyword when there is an exact keyword match.
Is the mix physically accurate for paint?
No. This is a quick digital color blend for planning and UI work, not a pigment simulation for real paint chemistry.
When should I use this instead of Color Picker?
Use this page when you already have two candidate colors and want to test an in-between result. Use Color Picker when you want to browse a single color visually first.
What is stored in the share URL?
The share URL stores the two HEX colors and the blend ratio only.