These are the terms that come up on almost every other page here — the six relationship types behind any two- or three-color scheme, the three independent attributes of a single color, the models used to specify one exactly, and the perceptual and accessibility rules that decide whether a pairing actually works for a real viewer. For named colors themselves, see the full color dictionary (211+ entries) or the Japanese color glossary (20 traditional named colors) — this page defines the vocabulary those pages assume you know.

Color relationships

How two or more hues sit relative to each other on the color wheel — the choice that decides whether a palette reads as calm, energetic, or balanced.

Complementary

Two colors positioned roughly opposite each other on the color wheel — around 180° apart in hue. Complementary pairs create the strongest possible contrast between two hues, which is why they're the default choice for anything that needs to grab attention (a call-to-action button against its background, a sports team's colors).

Worked example — Wada archive plate English Red & Cerulian Blue (hue distance 166°)

#d96629 #0093a5

22 of the archive's 348 plates fit this pattern.

Analogous

Colors that sit next to each other on the wheel — typically within about 30–35° of hue. Analogous schemes feel cohesive and low-tension because no color is fighting another for attention; they're the natural choice for backgrounds, gradients, and anything meant to feel calm rather than urgent.

Worked example — Wada archive plate Raw Sienna & Pale Lemon Yellow (hue distance 18°)

#bb7125 #ffefae

24 of the archive's 348 plates fit this pattern.

Triadic

Three colors spaced evenly around the wheel, roughly 120° apart. A triadic scheme is vibrant even when none of the three colors is especially saturated, because the eye reads the even spacing as balance. It's harder to use well than a two-color scheme — one hue usually needs to dominate and the other two act as accents.

Worked example — Wada archive plate Cinnamon Buff & Pistachio Green +1 (hue spacing 119° / 92° / 149°)

#fdc57e #648f7b #66629c

2 of the archive's 348 plates fit this pattern.

Split-complementary

A base color plus the two hues adjacent to its direct complement, rather than the complement itself — for example a blue paired with yellow-orange and red-orange instead of plain orange. It keeps most of the contrast of a complementary pair with less visual tension, and is a common way to soften a bold two-color scheme without losing its energy.

Tetradic (square)

Four colors formed by two complementary pairs, spaced evenly (roughly 90° apart) around the wheel. The richest and hardest of the standard schemes to balance — with four hues in play, one color almost always needs to lead and the rest need to be used in deliberately unequal amounts, or the palette reads as noisy.

Monochromatic

A single hue, varied only by lightness and saturation — one color family expressed as a light tint, a mid-tone, and a dark shade. It is the safest scheme to get right (nothing can clash with itself) and the one most likely to feel flat without enough contrast in value between the steps.

Worked example — Wada archive plate Golden Yellow & Pale Raw Umber (same hue family, different value)

#f3a257 #71502f

14 of the archive's 348 plates fit this pattern.

Color attributes

The three independent dimensions that describe any single color, plus the three ways of systematically varying one.

Hue

The attribute that answers “what color is it” in the everyday sense — red, orange, yellow, green, blue, purple — independent of how light, dark, or muted it is. Technically, hue is the angle (0–360°) around the color wheel; every computed example on this page is classified purely by hue angle.

Saturation (chroma)

How intense or muted a color is at a given hue and lightness — from a vivid, pure hue at full saturation down to a grey at zero saturation, with the hue itself unchanged. Two swatches can share the exact same hue and still look completely different in mood purely because one is desaturated.

Value (lightness)

How light or dark a color is, independent of hue or saturation — the dimension that would survive if a photo were converted to black and white. Value is the single biggest factor in whether text is readable against a background, which is why contrast-ratio math (below) is built on lightness, not hue.

Tint

A hue with white mixed in — raising its value while lowering its saturation. Tints are what most “pastel” palettes are built from: the same underlying hue, pushed lighter and softer.

Shade

A hue with black mixed in — lowering its value. Shades are how a single brand color becomes a workable palette on its own: a shade of the primary color reads as intentional depth rather than a different color entirely.

Tone

A hue with grey mixed in — lowering its saturation without necessarily changing its value. Toned colors are the ones that read as “sophisticated” or “muted” rather than bright, because the grey desaturates the hue while leaving its lightness roughly where it was.

Color models

The systems used to specify an exact color for screens, print, or a manufactured product.

RGB

Red-Green-Blue — the additive model every screen uses. Each channel runs 0–255; mixing all three at full intensity produces white, and all three at zero produces black. Every hex code on this site (like #9A2A2A) is RGB written in base-16, two digits per channel.

CMYK

Cyan-Magenta-Yellow-Key(black) — the subtractive model used in printing, where ink absorbs light rather than emitting it. CMYK and RGB cover different, only partly overlapping ranges of visible color (their “gamut” — see below), which is why a color that looks vivid on screen can print duller: it fell outside what CMYK ink can reproduce.

HSL / HSV

Hue-Saturation-Lightness (or Hue-Saturation-Value/Brightness) — the same information as RGB, reorganized so a designer can adjust one perceptual dimension at a time instead of three interdependent channels. This page's own hue/chroma math is computed by converting each hex color into this space first.

Pantone (spot color)

A proprietary, numbered color-matching system used mainly in print and manufacturing, where a color needs to be identical across different printers, materials, and countries — something RGB or CMYK values alone can't guarantee, since the same code can render slightly differently on different equipment.

Perception & accessibility

How color is actually experienced by a viewer — not every combination that looks fine to one person is usable by everyone, or reproducible on every device.

Contrast ratio

A number from 1:1 (identical colors) to 21:1 (pure black on pure white) describing how distinguishable two colors are, computed from their relative luminance — not their hue. Two colors can look very different in hue and still fail a contrast check if their lightness is too close; this site's own /tools/contrast-checker/ computes this exact ratio for any two hex values you enter.

WCAG AA / AAA

The Web Content Accessibility Guidelines' minimum contrast-ratio thresholds: 4.5:1 (AA) or 7:1 (AAA) for normal body text, with lower thresholds (3:1 / 4.5:1) for large text. These are the numbers a contrast checker is testing your pairing against — a pass means the text is legible to most people with low vision, not merely legible to you.

Color temperature (warm / cool)

The everyday split between hues that read as “warm” (reds, oranges, yellows — roughly hue 0– 85° and 345–360°) and “cool” (greens, blues, violets). It's a perceptual grouping, not a physical temperature, and it's the same hue-angle math used elsewhere on this page — warm and cool sit on opposite arcs of the same wheel.

Color vision deficiency (color blindness)

A reduced ability to distinguish certain hues, most commonly red-green (affecting roughly 1 in 12 men, 1 in 200 women). It's the practical reason contrast ratio and value — not hue alone — are the load-bearing signals for accessible design: a red/green pairing with matched lightness can be functionally invisible as “two different colors” to a colorblind viewer even though it reads clearly to most people.

Gamut

The full range of colors a specific device, ink set, or color model can actually reproduce. No system covers all colors humans can perceive; sRGB (the standard for the web), a printer's CMYK gamut, and a human eye's full range are three different, overlapping shapes — which is why a color can look right on one screen and slightly off on another.

Achromatic

A color with zero saturation — pure black, pure white, or any grey between them. Achromatic colors have no hue at all, which is exactly why the hue math on this page excludes them: dividing by a near-zero chroma value produces noise, not a meaningful angle.

See also

For color science applied at length rather than defined in one paragraph, read Color Psychology in Wada's System (the same hue math on this page, applied across the full 348-plate archive), or use the contrast checker and palette-from-image tool to apply these terms to your own colors directly. The full color dictionary and palette archive are the site's two primary reference indexes.

— colorcombinations.org editorial

Library

Go deeper on color theory

The books behind the terms on this page — color theory, history, and reference that designers keep close.

Book links are Amazon Associates affiliate links. Your price is unchanged; a small commission supports the archive. As an Amazon Associate we earn from qualifying purchases.

From the archive

Support the archive The full catalog, on your disk, as a thank-you.

  • All 378 palettes (348 Wada + 30 editorial) in five formats
  • Figma design tokens (W3C-spec JSON, drag into any file)
  • Tailwind v4 + v3 configs — drop into any project
  • CSS custom properties — every plate, one stylesheet
  • 378 museum SVG plates — print-ready at any size
  • Full JSON — colors, names, eras, moods, dominant hues
See what's inside

Launching soon. The free archive stays free, always.