Most accent colors break in one mode — too bright on white, or too dark on black. #667eea lands in the narrow luminance window (0.10–0.30) where a color clears 3:1 contrast against both extremes simultaneously. But dozens of colors hit that window. What makes this one feel magical rather than merely correct?
The answer is the gap between how bright it looks and how bright it actually is. At 66% HSL lightness, your eye expects a color too pale for white backgrounds. It isn't. The WCAG luminance formula weights blue at just 0.0722 — versus 0.7152 for green. #667eea has a very high blue value (234/255) that barely registers on the brightness scale, leaving a true relative luminance of 0.237. The color looks vivid. The math says it's mid-dark. Both are right.
Warm hues can technically hit the same window, but at their required luminance they look like what they are — dark burnt oranges, olive greens, muted reds. There's no surprise. The surprise is the whole trick. The cool half of the spectrum — sky through purple — shares this property: each hue can carry high chroma while keeping luminance low, so they look vivid at a depth that warm hues can't achieve without looking muddy. Any of them could have been the discovered color.
The Cool Half — Dual-Mode Tonal Scales
Each hue below uses the same oklch lightness steps, so the 500/600/700 rows are perceptually equivalent across all five. Steps 500–700 are dual-mode for every hue. Sky's wider luminance range extends the dual-mode window down to 800.
sky · oklch(L, 0.155, 218°)
|
500 — #009cc6oklch(0.627 0.155 218°)lum 0.279 · 3.2:1 on white · 6.6:1 on black |
|
600 — #008db6oklch(0.580 0.155 218°)lum 0.224 · 3.8:1 on white · 5.5:1 on black |
|
700 — #007ba3oklch(0.520 0.155 218°)lum 0.168 · 4.8:1 on white · 4.4:1 on black |
|
800 — #00628aoklch(0.440 0.155 218°)lum 0.106 · 6.7:1 on white · 3.1:1 on black |
blue · oklch(L, 0.165, 248°)
|
500 — #0e8de6oklch(0.627 0.165 248°)lum 0.249 · 3.5:1 on white · 6.0:1 on black |
|
600 — #007ed6oklch(0.580 0.165 248°)lum 0.198 · 4.2:1 on white · 5.0:1 on black |
|
700 — #006bc2oklch(0.520 0.165 248°)lum 0.144 · 5.4:1 on white · 3.9:1 on black |
indigo · oklch(L, 0.165, 265°)
|
500 — #5682eboklch(0.627 0.165 265°)lum 0.239 · 3.6:1 on white · 5.8:1 on black |
|
600 — #4973dboklch(0.580 0.165 265°)lum 0.188 · 4.4:1 on white · 4.8:1 on black |
|
700 — #3961c6oklch(0.520 0.165 265°)lum 0.135 · 5.7:1 on white · 3.7:1 on black |
violet · oklch(L, 0.1638, 271.5°) — the original
|
500 — #667eeaoklch(0.627 0.1638 271.5°)lum 0.237 · 3.7:1 on white · 5.7:1 on black |
|
600 — #596fdaoklch(0.580 0.1638 271.5°)lum 0.186 · 4.5:1 on white · 4.7:1 on black |
|
700 — #495dc6oklch(0.520 0.1638 271.5°)lum 0.133 · 5.7:1 on white · 3.7:1 on black |
purple · oklch(L, 0.155, 295°)
|
500 — #9072dboklch(0.627 0.155 295°)lum 0.231 · 3.7:1 on white · 5.6:1 on black |
|
600 — #8263cboklch(0.580 0.155 295°)lum 0.180 · 4.6:1 on white · 4.6:1 on black |
|
700 — #7151b7oklch(0.520 0.155 295°)lum 0.128 · 5.9:1 on white · 3.6:1 on black |
Full Hue Range — same contrast fingerprint as #667eea
All thirteen hues at the luminance that matches #667eea (0.237). The cool half looks vivid. The warm half technically qualifies but looks dark at this luminance — the perceptual mismatch that makes the cool colors feel special is absent.
|
crimson — #e25569oklch(0.641 0.175 15°)lum 0.237 · 3.7:1 on white · 5.7:1 on black |
|
coral — #dc5e52oklch(0.638 0.16 28°)lum 0.237 · 3.6:1 on white · 5.8:1 on black |
|
amber — #d06900oklch(0.632 0.16 55°)lum 0.235 · 3.7:1 on white · 5.7:1 on black |
|
lime — #789000oklch(0.610 0.16 120°)lum 0.238 · 3.6:1 on white · 5.8:1 on black |
|
emerald — #009a4doklch(0.602 0.16 152°)lum 0.236 · 3.7:1 on white · 5.7:1 on black |
|
teal — #009784oklch(0.582 0.155 183°)lum 0.236 · 3.7:1 on white · 5.8:1 on black |
|
sky — #0091baoklch(0.590 0.155 218°)lum 0.237 · 3.7:1 on white · 5.8:1 on black |
|
blue — #058ae2oklch(0.617 0.165 248°)lum 0.237 · 3.7:1 on white · 5.7:1 on black |
|
indigo — #5681eaoklch(0.625 0.165 265°)lum 0.239 · 3.7:1 on white · 5.7:1 on black |
|
violet — #667eeaoklch(0.627 0.164 271.5°)lum 0.237 · 3.7:1 on white · 5.7:1 on black |
|
purple — #9274ddoklch(0.633 0.155 295°)lum 0.237 · 3.6:1 on white · 5.8:1 on black |
|
fuchsia — #b06bc5oklch(0.637 0.15 318°)lum 0.236 · 3.7:1 on white · 5.8:1 on black |
|
rose — #cb60a1oklch(0.640 0.155 345°)lum 0.237 · 3.7:1 on white · 5.7:1 on black |
Balanced Variants — lum 0.18, symmetric ~4.5:1 contrast on both backgrounds
One half-step darker across all hues. Contrast is nearly symmetric — almost equal ratios on white and black. The warm colors here look even more muted; the cool colors hold their character.
|
crimson — #c84b52oklch(0.584 0.16 15°)lum 0.179 · 4.6:1 on white · 4.6:1 on black |
|
amber — #be5900oklch(0.577 0.16 55°)lum 0.181 · 4.6:1 on white · 4.6:1 on black |
|
lime — #5d8100oklch(0.554 0.16 120°)lum 0.180 · 4.6:1 on white · 4.6:1 on black |
|
emerald — #00883coklch(0.543 0.16 152°)lum 0.179 · 4.6:1 on white · 4.6:1 on black |
|
teal — #008576oklch(0.523 0.155 183°)lum 0.181 · 4.5:1 on white · 4.6:1 on black |
|
sky — #007eaboklch(0.532 0.155 218°)lum 0.179 · 4.6:1 on white · 4.6:1 on black |
|
blue — #0179cfoklch(0.566 0.165 248°)lum 0.182 · 4.5:1 on white · 4.6:1 on black |
|
indigo — #4871d5oklch(0.571 0.165 265°)lum 0.180 · 4.6:1 on white · 4.6:1 on black |
|
violet — #6969d4oklch(0.575 0.164 271.5°)lum 0.179 · 4.6:1 on white · 4.6:1 on black |
|
purple — #8b60cboklch(0.584 0.155 295°)lum 0.182 · 4.5:1 on white · 4.6:1 on black |
|
fuchsia — #a457b5oklch(0.584 0.15 318°)lum 0.180 · 4.6:1 on white · 4.6:1 on black |
|
rose — #be4c89oklch(0.586 0.155 345°)lum 0.179 · 4.6:1 on white · 4.6:1 on black |