Color Mixer
Online Color Mixer or Color Combiner. Easy way to mix colors.
Try other applications
Mix colors easily!
Color Mixer or Color Combiner allows users to mix two colors in different quantities and see the color that will result after mixing. To run the application, you should enter color codes in any format, like Color Name, RGB, HEX, HSL, HSV, HWB, LAB, LCH, CMYK, XYZ, OKLAB, or OKLCH. Also, you can switch between different color spaces, like sRGB, sRGB-linear, LAB, OKLAB, LCH, OKLCH, XYZ, XYZ-d65, XYZ-d50, HSL, or HWB. If you’re unhappy with the result, you may always reset the Color Mixer and start over. Once you have found the desired color mix, you can copy the result to your clipboard.
Color Mixer converts both colors to the specified color space and then sums the colors in a given percentage. You can use the application from mobile devices, tablets, or computers. The color blending tool is supported by all operating systems with a browser — Windows, Mac OS, Linux, Android, and iOS. Start using our online Color Mixer safely, secure, and easy way!
The Color Mixer is developed based on the W3C specification and is intended for developers and users to help achieve color mixing designs. If you would like to work with colors programmatically, please visit our documentation.
Why is color space important?
A color space is a defined range of colors it can produce. Color space means the use of a specific color model (color code) that turns colors into numbers. The two most common are red, green, and blue (RGB), and cyan, magenta, yellow, and key (CMYK).
Color space is an extremely important concept to understand when you’re trying to design web site, edit photos or print images. When a designer creates a product, he wants the color to be faithfully reproduced in whatever format a person sees. That’s why color space is important. So, RGB is better for website images, and CMYK is often used in print because it allows for more color variations.
Color Mixer is a powerful color mixing tool right in your browser. Start using our online application safely, securely and simply just now!
- Easy way to mix colors
- Selecting supporting color spaces
- Wide range of supported color codes
- Work from your favorite device
- No limits, no registration and installation of additional software
How to mix colors
- Input the color names or color codes that you want to mix into the “first color” and “second color” input elements. RGB, HEX, HSL, HSV, HWB, LAB, LCH, CMYK, XYZ, OKLAB, and OKLCH color codes are supported.
- Select settings: color space, proportions of colors, and format for the result color. You can define percentages of the first color (p1) in the range from 0% to 100%. The second color becomes 100% — p1. The default value is 50% for each color.
- You will see the result of colors mixing in the “result color” text box. You can change color space, percents, output color formats to get the desired result.
FAQ
- What is Color Mixer for? This application takes two color specifications and returns the result of mixing them, in a given color space, by a specified amount. The result of mixing is the color at the specified percentage along with progression of the second color to the first color. The choice of mixing color space can have a significant impact on the end result.
- What is a color space? A color space is a specific organization of colors that is a collection of information and data that declares how a system or device displays color to a user. The default color space on the web is sRGB, where “s” means standard. It was created by Microsoft and Hewlett-Packard in 1996 and was widely adopted for displays, software, etc.
The same colors may look different on print and on the web. Therefore, you should use tools to convert, for example, RGB colors for the web, to CMYK colors for print. Web colors are ideal for web design display with the sRGB color space; on another side, most commercial printing is done in CMYK color space. - Is it safe to use Color Mixer? We ensure safe and secure using of free online Color Mixer. We do not keep or inspect the contents of the entered data in any way. Our application runs online and does not require any software installation.
- Can I use Color Mixer on Linux, Mac OS, iOS, or Android? Yes, you can use free Color Mixer on any operating system that has a web browser. Input colors in any color format, choose color space and get the result of mixing at once!
Color Mixer
Color Mixer is a free online tool for blending two colors and find the interpolated colors just between these two. You can either enter a HEX color or an RGBA color with opacity as input and the tool calculates the mixed color by making an interpolation. It finds the color just between these two colors by blending these HTML colors.
You can define step size for interpolation, that means you can find all colors between 2 HTML colors in n steps. You can select step size between a range from 1 to 10. By using steps, you can get a color spectrum between 2 colors or find shades of a tone.
Here is an image showing how 2 colors are mixed. When blue and red are blended, you get purple. In terms of rgba, blue is rgb(0, 0, 255) and red is rgb(255, 0, 0). When these 2 colors mixed, the result in rgba is rgb(128, 0, 128) which is the color code of purple. It is basic interpolation.
The situation is a little complicated when alpha (opacity) of colors is different than 1. But, since there is a math in color coding, it’s not rocket science. The tool works like an online HTML color blender, and it can mix either solid or opaque colors.
How to use Online Color Mixer?
You can mix two colors and get the color code of mixed colors by following these steps.
- Select 2 colors that you want to mix. It can be either a solid color or a color with opacity.
- Select step size from list between 1 and 10. It defines the number of colors between the colors you choose.
- Click «Mix Colors» button for seeing the mixed color codes and its color preview.
- Results will be shown in 3 color code formats: HEX, RGBA and HSLA. Click on color codes to copy their values on your clipboard. Also, you can view whether the color is light or dark.
Color mixer generator
Generate the perfect color for your design with our Color Mixer tool. Mix two colors, adjust and preview any combination of colors with ease.
#f77f4b
Tip: Press SPACE to generate and mix random colors
Code
--color-1: #e91e63;--color-2: #ffc107;/** USING CSS color-mix() */color: color-mix(in srgb, var(--color-1), var(--color-2) 50%);background-color: color-mix(in oklab, var(--color-1), var(--color-2) 50%);background: color-mix(in hwb, var(--color-1), var(--color-2) 50%);
Click a code line to select it and press CTRL + C to copy it
Keep in mind that some browsers do not support CSS color-mix() yet. Learn more about browser compatibility
Upgrade to Colorffy PRO to remove ads, export files in various formats, and access additional pro features.
- Export your gradient or palette colors to .json, .css, and .csv files
- Export color conversion tables to .csv file
- Remove ads
- Access to all tools
- Android and Flutter gradient code
- Gradient wallpaper generator
- Get your hands on some amazing PRO layouts with the Color Palette from Image tool
Payments are secure and powered by Stripe .
Color Mixer
Color mixer or Color Blender is one of many browser tools available on the ColorDesigner website. It allows users to blend two or more colors in different quantities and see the color that the mixture will result in after blending as well as the proportions and colors used to create it. In addition to displaying the resulting color, the Color Mixer also allows the user to display and use colors in different modes such as HLC, HSL, and LAB as well as RGB and LRGB.
How to use
Color Mixer page greets the user with a basic selection of primary and secondary colors which the user can then mix and blend freely as they see fit. Start by choosing colors that you want to blend. You can either chose your colors from the already existing shades offered on the website or add your own custom color that you created. Once you have all the colors that you want to mix, add each color in the desired quantity. The resulting color will be displayed along with the proportions of colors used for the mixture and keep changing based on the colors that the user adds. Keep mixing colors until you are satisfied with the result. Your color will also be displayed in different modes and formats, so you can easily recreate them at a later point in time.
Custom Colors
Users can add custom colors of their choosing by using either the Color Picker which will display the color palette and allow the user to choose the desired color by clicking on it from the color wheel, or by entering either the colors Hex Code, the RGB decimal code, or the values of the hue, saturation, and brightness. Additionally, the user can swap to the swatches tab which will, in turn, display the color swatches for both primary and secondary basic colors. From there, once the user settles on the basic color, he or she will be able to pick one of the many shades of the desired color which will be displayed on the screen. Once the user is happy with their choice, they can confirm their selection, and their color will be added to the main color selection from which they can decide on the mixing quantity.
Mix two colors online
Select two colors to mix, and then click OK at the bottom of the page. Other settings already installed by default.
Example of mixing red and yellow colors on this website, under each color shows the HEX (html) code:
| Color #1 | + | Color #2 | = | Result |
| #FF0000 | #FFED00 | #FF7700 |
Example of mixing the spring-green and magenta (purple) colors that you can pick from the palette:
| Color #1 | + | Color #2 | = | Result |
| #00FF7F | #FF00FF | #7F7FBF |
Example of mixing red and blue color:
| Color #1 | + | Color #2 | = | Result |
| #FF0000 | #0047AB | #7F2356 |
Example of mixing blue and yellow color:
| Color #1 | + | Color #2 | = | Result |
| #0047AB | #FFED00 | #7F9956 |
If you’re interested, this site also has a getting of primary colors of image with displaying table of the colors in hex and rgb format, with a drawing of the palette from the right side of image.