We're live on Product Hunt!Support us
ColorArchive

A curated color library with 5,000+ algorithmically generated colors. Browse, search, save favorites, and export palette tokens — no account required.

CollectionsFamiliesNotesGuidesFree ResourcesConvertColorblindAboutSupportUpdates
Ready for static export
Privacy·Terms·Refunds·Cookies·Commerce Disclosure
colorarchive.org · © 2026 ColorArchive
Skip to content
ColorArchive
ProLog in
ArchiveAll ColorsCollections
Combinations Guide
Search intent: color combinations design complementary analogous triadic color harmony how to choose colors palette 60 30 10 rule color wheel

How to Choose Color Combinations That Work

The practical framework for choosing 2-5 color combinations for design projects — covering harmony types, proportion, and the common mistakes that make palettes feel off.

Color HarmonyPalette DesignColor Theory
Key points
The 60-30-10 rule is the most reliable starting proportion for a 3-color combination: 60% dominant (usually a neutral or near-neutral), 30% secondary, 10% accent. The dominant color sets the mood; the accent color gets remembered. Reversing these proportions — a small amount of neutral with a large area of vivid color — is one of the most common causes of palettes that feel overwhelming in real applications.
Complementary combinations (opposite hues on the color wheel) create maximum contrast and energy. They work at full saturation only at small scale or for very specific brand personalities. For most applications, use complementary hues at different saturation levels: one muted, one vivid. This preserves the energy of the complementary relationship while making the palette livable.
Analogous combinations (3-4 adjacent hues) are inherently cohesive but risk feeling flat. The solution is variation in lightness and saturation within the analogous range rather than adding more hues. A well-varied analogous palette — light-medium-dark of the same hue family, with one step more saturated as the accent — reads as polished and intentional.

Starting with harmony type

Harmony type describes the geometric relationship between your hues on the color wheel. Complementary (0° + 180°) is the highest contrast relationship — bold and energetic. Analogous (0° + 30° + 60°) is the lowest contrast — calm, cohesive, naturalistic. Triadic (0° + 120° + 240°) balances variety with structure. Split-complementary (0° + 150° + 210°) adds variety with less tension than full complementary. Monochromatic (single hue, multiple lightness steps) is the most controllable and the most at risk of flatness. Choose your harmony type based on the emotional register of the brand, not aesthetic preference alone.

The role of neutrals

Most functional color palettes are 80% neutral — the background, surface, body text, and secondary elements that carry the visual weight of the layout. The hue colors you agonize over typically appear at 10-30% of the total visual area. This means neutral design is the primary skill, and hue selection is the secondary one. A palette with a poor neutral strategy fails regardless of how well-chosen the accent colors are. Warm neutrals (slightly yellow or red-shifted) pair with warm hue palettes; cool neutrals (slightly blue or gray-shifted) pair with cool palettes. Mixing warm accents with cool neutrals creates the temperature dissonance that makes combinations feel 'almost right but off.'

Featured collection
Cobalt Spectrum

A five-step monochromatic cobalt scale — from whisper pale through deep ink — the complete system blue for professional digital products.

Open collectionAll collections
Open next
Browse Color CombinationsColor Harmony CalculatorPalette Generator
Practical next step

Move from the guide into a concrete palette lane

Guides explain the use case. Collections prove the taste. Pro handles the export and implementation layer.

Upgrade to ProMore guides
Related guides
Monochromatic Guide
Monochromatic Color Palettes: A Designer's Complete Guide
How to build effective monochromatic palettes using a single hue — covering scale construction, contrast management, and when monochromatic design is the right choice.
Warm Color Guide
Warm Color Palette Guide: Reds, Oranges, Yellows, and Their Neutrals
Warm color palettes are the most emotionally immediate in design — and the most likely to go wrong. A designer's guide to building warm palettes that feel rich and intentional rather than aggressive or cheap.
Purple Color Guide
Purple Color Palette Guide: Violet, Lavender, Plum, and Beyond
Purple is the most complex hue family in design — spanning royal authority to digital tech, spiritual mystery to luxury beauty. A practical guide to using purple palettes effectively.