Split-Complementary Palette Generator
Enter a base color to generate a split-complementary palette — the base color plus the two colors on either side of its direct complement. You get most of the contrast of a complementary scheme, but with a softer, more varied result.
What Is a Split-Complementary Palette?
A split-complementary palette uses three colors: a base color and the two colors that flank its direct complement on either side. Instead of taking the 180° complement directly, you step ±30° (or another split angle) away from it. The split-complementary scheme retains most of the high contrast of a complementary pair while introducing a subtler, more nuanced second accent.
The Mathematics
Given a base hue \( H \) and a split angle \( \alpha \) (typically 30°):
\[ H_1 = H \quad \text{(base)} \]
\[ H_2 = (H + 180° - \alpha) \bmod 360° \]
\[ H_3 = (H + 180° + \alpha) \bmod 360° \]
At \(\alpha = 30°\), the two accent colors sit 150° and 210° away from the base — not as opposite as a pure complement (180°), but close enough to create strong contrast.
Choosing the Split Angle
- 20° — Nearly complementary; the two accents are very close together. Subtle warmth/coolness distinction between them.
- 30° — The classic choice. The two accents feel related to each other while still contrasting strongly with the base.
- 45° — Wider split; the accent pair starts to feel like its own analogous subset.
- 60° — Approaches a triadic configuration from one side. The three colors feel more evenly distinct.
Why Choose Split-Complementary Over Complementary?
- A straight complementary pair can feel aggressive when both colors are used in equal proportion. Split-complementary gives you two accent options that feel related — you can use them together without creating visual chaos.
- It's easier to achieve balance: the two accent colors can each occupy smaller proportions of the composition, with the base dominating.
Frequently Asked Questions
When should I use split-complementary instead of complementary?
When you need three distinct colors, or when the pure complementary pairing feels too stark. Split-complementary is popular in UI design where you need a primary brand color, a background tone, and an accent that doesn't clash.
Which split angle is most common in practice?
30° is the traditional split used in color theory textbooks. Many digital design tools also default to 30° for the split-complementary preset.
How does split-complementary relate to triadic?
A triadic palette spaces three colors at exactly 120° from each other — completely symmetric. A split-complementary is asymmetric: one base and two accents that are never 120° apart from the base. As the split angle approaches 60°, the result overlaps with a triadic-like spacing on one side.