Color Mixer
Mix two colors and get the resulting color.
- 100% free
- Private in browser
- No signup
- No watermarks
Mixed Color
#800080
RGB(128, 0, 128)
Rate this tool
Be the first to rate — helps others and improves this page.
About Color Mixer
Mix and blend two colors to create new shades, tints, and intermediate transition swatches. Customize the mixing ratio and step count to instantly generate CSS gradients and downloadable color palettes.
How to use Color Mixer
- Pick Color 1 and Color 2 using the color pickers or enter HEX codes.
- Adjust the Mix Ratio slider to change the balance of each color.
- Select the number of transition steps (3, 5, 7, or 9 steps).
- Copy the blended hex code or copy the full CSS gradient.
Key features
- Smooth RGB linear interpolation between any two colors
- Adjustable mixing ratio from 0% to 100%
- Multi-step palette generation (3, 5, 7, 9 swatches)
- 1-click copy for Hex codes and CSS gradient syntax
- Real-time responsive visual preview
Frequently asked questions
- How is color mixing calculated?
- Each red, green, and blue channel is linearly interpolated based on the percentage weight of each color.
- Can I copy the CSS gradient?
- Yes, 1-click copies the ready-to-use linear-gradient CSS code.
Related In-Depth Guides
Learn practical workflows, real-world examples, and expert tips in our comprehensive guides: