Color Mixer

Mix two or more colors with RGB, RYB, LAB and OKLCH methods. Get the exact result, color name, WCAG contrast, intermediate steps and send it to the palette generator

Mix multiple colors by adjusting their proportions. You can add up to 5 different colors.

Mixing Method

Popular Presets

Common mixes — click to load

Colors to Mix

50%
50%

Resulting Color

#800080
Color name:Mystery Purple
WCAG Contrast
9.4:1AAA
2.2:1

Use as text → white bg

Color Values

HEX#800080
RGB128, 0, 128
HSL300°, 100%, 25%

Related Colors

Complementary
#008000
Analogous

Intermediate Steps

Number of steps:
#ff0000
#d4002b
#ab0054
#800080
#5400ab
#2b00d4
#0000ff

Click any step to copy its hex code

Compare Methods

Result of the current mix with each method

RGB#800080
RYB#800080
LAB#ca0088
OKLCH#ba00c2

Preview

Gradient between colors

Weighted mix

How it works

Mixing colors is a fundamental technique in graphic design, painting and web development. Our tool offers four professional blending methods that produce different results depending on the use case.

Available Blending Methods

RGB Mixing (Additive)

Simulates how light mixes. Combining all primary colors (red, green, blue) produces white. This is the standard method for screens, monitors and web design. Ideal for UI/UX and frontend development.

RYB Mixing (Subtractive)

Based on traditional art primary colors (red, yellow, blue). Simulates physical paint and pigment mixing. Perfect for artists, illustrators and print projects.

CIE LAB Space Mixing

The LAB color space was designed to be perceptually uniform: distances between colors correspond to differences perceived by the human eye. It produces the most natural blends and is ideal for creating smooth gradients and professional color transitions.

OKLCH Mixing (Modern)

OKLCH is the most modern color space, used natively by CSS (color-mix()). It offers advanced chromatic blending that preserves color vibrancy and produces smoother transitions than LAB, especially in blue and purple tones.

Tool Features

  • 4 blending methods: RGB, RYB, LAB and OKLCH
  • Up to 5 colors with individually adjustable weights
  • Popular presets: common mixes with one click (brown, skin tone, neon...)
  • Compare methods: visualize the result with all 4 methods side by side
  • Color name of the result automatically identified
  • WCAG contrast of the result against white and black
  • Intermediate steps configurable (3-11 steps) between the first two colors
  • Open steps as palette to view the full color scale
  • Color values of the result in HEX, RGB and HSL
  • Related colors: complementary and analogous of the result
  • Send to generator to create a full palette from the mixed color

Practical Use Cases

Case 1: Create intermediate color for gradient

You have blue #3B82F6 and green #10B981. You need an intermediate color for a 3-step gradient.

→ Mix 50/50 in LAB: you get a natural and harmonious turquoise

Case 2: Soften a vibrant color

Your red #EF4444 is too intense for a background.

→ Mix with gray #9CA3AF at 30% to get an elegant muted red

Case 3: Simulate physical paint

You want to know what color you'll get mixing blue and yellow paint.

→ Use RYB mixing: Blue + Yellow = Green (RGB would give cyan, but RYB simulates real pigments)

Case 4: Create realistic skin tones

Mix orange, white and a touch of red with the LAB method to get natural skin tones that look harmonious on any screen.

Frequently Asked Questions

Which blending method should I use?
For digital and web design use RGB (additive mixing). To simulate paints and pigments use RYB (subtractive mixing). For the most natural results use LAB (perceptual mixing). For modern chromatic blending compatible with CSS use OKLCH. Use the "Compare Methods" panel to see differences at a glance.
Why doesn't mixing red and green give brown?
In RGB mixing (light), red + green = yellow, because light is additive. Brown is obtained in subtractive mixing (RYB) which simulates pigments, or by adding black to orange in any method.
Can I mix more than two colors?
Yes, you can mix up to 5 colors simultaneously. Each color has its own adjustable weight from 0% to 100%, allowing you to control the exact proportion of each one in the final blend.
What is the difference between additive and subtractive mixing?
Additive mixing (RGB) simulates light: combining all colors produces white. It's used in screens. Subtractive mixing (RYB) simulates pigments: combining all colors produces a dark/brown tone. It's used in painting and printing.
What is the LAB color space?
CIE LAB is a color space designed to be perceptually uniform. This means that the mathematical distance between two colors in LAB corresponds to the difference perceived by the human eye. That's why it produces the most natural blends and gradients.
Can I use the resulting color to create a palette?
Yes, use the "Send to Generator" button below the resulting color. This will send the mixed color to our palette generator, where you can create a complete palette based on that color with different color harmonies.
What are intermediate steps?
Intermediate steps show the gradual transition between the first two colors. You can choose between 3 and 11 steps. They're useful for creating gradients, color scales or finding specific transition tones. Click any step to copy its hex code.
How do I mix colors to get brown?
To get brown, use the RYB (subtractive) method and mix red with green, or orange with blue. You can also mix the three primaries (red, yellow, blue) in similar proportions. In RGB, mix orange (#FF8C00) with a bit of blue (#0000FF).