Color Palettes

Interactive color wheel

Drag the dot around the wheel to pick a color. You instantly see the colors that go with it for each type of color harmony.

Drag the dot or tap the wheel

Colors in this scheme

Tap a color to copy its HEX code.

What is a color wheel

It's a circle that arranges colors by hue. Neighbors look alike and opposites contrast. It helps you pick combinations that work, in design, home decor or fashion.

Primary, secondary and tertiary colors

On screens the primaries are red, green and blue (RGB). Mixing two primaries gives the secondaries: yellow, cyan and magenta. Tertiaries sit between a primary and a secondary, like orange or violet. Painters use the classic model: red, yellow and blue.

Warm and cool colors

Warm colors run from red to yellow and feel energetic and close. Cool colors run from green to violet and feel calm and distant. One warm color with a few cool ones, or the other way around, adds contrast and keeps balance.

Types of color schemes

Complementary

Two colors opposite each other. They give the most contrast. Example: blue #2B6CB0 and orange #DD8A2B, great for a button that stands out.

Analogous

Three neighboring colors. They look calm and harmonious. Example: green, teal and blue, like a landscape.

Triadic

Three colors spaced evenly. Lively and balanced. Example: red, yellow and blue in a kids' illustration.

Split complementary

One color plus the two neighbors of its opposite. Strong contrast with less tension than complementary. Example: violet with yellow-green and orange.

Tetradic

Four colors forming a rectangle or square. Lots of variety: pick one as the main color and use the others for details.

Frequently asked questions

How do I use the color wheel?

Pick a base color by dragging the dot, or type its HEX code. Then choose a scheme and copy the colors shown below.

Which colors go together on the color wheel?

Opposites (complementary) contrast, neighbors (analogous) blend, and colors that form a triangle (triadic) feel balanced.

Why is red at the top?

It's the most common convention: hue 0° is red, and from there the wheel runs through yellow, green, cyan, blue and magenta.

Can I use these colors in Canva or CSS?

Yes. Copy each HEX code with one tap, or open the scheme in the palette generator to export it.

More guides and tools