Color Mixer

Blend two or more colors by setting their quantity. The mixed result updates in real time.

Add colors below
HEX #C8C8C8
RGB 200 200 200
HSL 0° 0% 78%
LAB 81 0 0
LCH 81 0 158°
Color Space

Perceptually uniform — most natural results.

0
#FF0000
0
#FF8C00
0
#FFFF00
0
#008000
0
#0000FF
0
#800080
0
#FF69B4
0
#00BFFF

What is Color Mixer

Color mixer or Color Blender is a tool that lets you 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 you to display and use colors in different modes such as LCH, HSL, and LAB as well as RGB and LRGB.

How to Use

  1. You will see a palette of colors. By default, all quantities are set to 0.
  2. Click + below any color to add it to the mix.
  3. Keep pressing + to increase the proportion of that color, or − to decrease it.
  4. The result panel on the left updates in real time, showing the blended color in HEX, RGB, HSL, LAB, and LCH formats.
  5. Click the pencil icon on any card to type in a custom HEX value, or click the swatch itself to use the color picker.
  6. Use the Color Space dropdown to change the blending algorithm.

Color Space Options

  • RGB — Averages raw sRGB channel values. Simple and predictable.
  • LRGB — Mixes in linear (gamma-decoded) RGB. Physically accurate for light sources.
  • LAB — Mixes in the perceptually uniform CIELAB color space. Produces the most natural-looking blends.
  • HSL — Interpolates hue, saturation, and lightness. Good for smooth hue transitions.
  • LCH — Mixes in LCH (polar form of LAB). Preserves chroma better than LAB for vivid color combinations.

Common Use Cases

  • Design — Find a midpoint or blended tone between two brand colors.
  • CSS — Get precise values to use in color-mix() or as custom properties.
  • Art — Preview how paint colors blend before mixing on canvas.
  • Accessibility — Blend foreground and background colors to test perceived contrast midpoints.