Find perfect color combinations with our color wheel
Explore complementary, analogous, triadic, and more color harmony schemes. Everything runs in your browser so your choices stay private.
#C837A4
#37C85B
1. What is a Color Wheel?
A color wheel is a circular diagram that organizes colors based on their chromatic relationships. It serves as a fundamental tool for artists and designers to understand how colors relate to one another and create harmonious combinations.
The traditional color wheel typically consists of 12 colors, including three primary colors (red, yellow, blue), three secondary colors (orange, green, purple) created by mixing primary colors, and six tertiary colors formed by mixing primary and secondary colors. This structure helps in identifying complementary, analogous, triadic, and other color schemes that work well together in design projects.

2. Color combinations

Complementary
Two colors that are on opposite sides of the color wheel. This combination provides a high contrast and high impact color combination – together, these colors will appear brighter and more prominent.
Monochromatic
Three different versions of a single color - darker, lighter, and in-between. Together, they create a calm and traditional mix of colors. This combination is easy to use in designs and gives a balanced and pleasing appearance.
Analogous
Three colors that are next to each other on the color wheel work well together. This combo is flexible but might be too much if overused. To keep it balanced, pick one main color and use the others as smaller details.
Triadic
Select three colors that are evenly distributed around the color wheel. These colors offer a robust contrast without being as intense as complementary colors. They are versatile and can create vibrant and dynamic combinations.
Tetradic
Four colors that are equally spread out on a color wheel. Tetradic color schemes are bold and work best if you have one main color and use the others as highlights. It's harder to balance your palette with more colors.
3. Primary, secondary and tertiary colors
On the RGB color wheel, there are 12 main colors. These colors are red, orange, yellow, green, blue, violet, magenta, rose, and some shades in between like chartreuse green, spring green, cyan, and azure.
The color wheel has three main groups: primary, secondary, and tertiary colors.
The primary colors in the RGB color wheel are like the building blocks of light. When you mix them together, they create white light. These special colors are red, green, and blue.
Secondary colors are created by mixing two main colors together. There are three secondary colors: cyan, magenta, and yellow. In the RGB color system, mixing light shows that red and green make yellow, green and blue make cyan, and blue and red make magenta.
Tertiary colors are made by mixing a secondary color with a primary color. Six tertiary colors are present: blue, violet, orange, rose, spring green, and yellow.

4. Warm and cool colors
The color wheel can be divided into warm and cool colors. Warmth or coolness of a color is called its color temperature. Color combinations on the wheel usually mix warm and cool colors in a balanced way. In color psychology, warm colors make us think of comfort and energy, while cool colors bring a feeling of calmness and being alone.
Warm colors are colors like red, orange, and yellow. They remind us of warmth, like the sun.
Cool colors like blue, green, and purple make us think of cool things like water.

5. Shades, tints and tones
You can make different versions of a color by mixing it with black, grey, or white.

Shade
When you add black to a color, it becomes darker and richer, creating a shade. Shades can be strong and may dominate.
Tint
A tint is made by mixing white with a color to make it lighter. It softens the color and can help balance bright color combinations.
Tones
A tone is made by mixing black, white, or gray with a color. It's like making a softer version of that color. Tones aren't as bright as tints and can show different details in the original color.
6. Hue, Saturation and Luminance
Hue is what we call a color, like red or blue. It's the pure color without any white, black, or gray added to it.
Saturation means how bright and strong a color looks. High saturation colors are vibrant and intense, while low saturation colors are more muted and grayish.
Luminance is how bright or light a color looks. It determines whether a color appears light or dark, regardless of its hue or saturation.

Frequently asked questions
Everything you need to know about how this tool works.
Complementary colors are opposite each other on the color wheel (180° apart). They create high contrast and make each other appear more vibrant when used together.
Drag or click on the circular color wheel to select your main color. The harmony pointers will automatically update to show related colors based on your chosen harmony type.
Triadic colors are three colors evenly spaced around the color wheel (120° apart). They provide strong contrast while maintaining harmony and balance.
Yes! All colors are provided as hex codes that you can copy and use in any design software, website, or application. The color combinations are royalty-free.
Analogous colors are three colors that sit next to each other on the color wheel. They create harmonious and pleasing color combinations that are often found in nature, making them ideal for creating cohesive and calming designs.
You can adjust the brightness (lightness) of colors by dragging the outer ring of the color wheel. The ring shows a gradient from black to white, allowing you to select lighter or darker variations of your chosen hue while maintaining the same color harmony.
Why choose our color picker?
Everything you need to create beautiful color combinations
Visual color theory
See color relationships instantly with our interactive color wheel. Understand how complementary, analogous, and triadic colors work together.
Privacy first
All color calculations happen locally in your browser. Your color choices never leave your device.
Design ready
Get hex color codes for every color in your harmony scheme. Copy and paste directly into your design tools.