Nuanced Contrast

Split-Complementary Color Harmonies

Split-complementary pairs a base color with the two colors adjacent to its exact complement (150° and 210°). It preserves strong visual contrast while feeling less aggressive.

Featured Split-Complementary Palettes Swatches

Algorithmically balanced • Click Launch to randomize infinitely

4 Colors
#6B3B14
rgb(rgb(107, 59, 20))
Rust
#E27B28
rgb(rgb(226, 123, 40))
Tangerine
#3740E1
rgb(rgb(55, 64, 225))
Cobalt Blue
#CFD0ED
rgb(rgb(207, 208, 237))
Ice Blue

Recommended Digital Use Cases

  • Modern B2B web applications
  • Mobile app onboarding flows and interactive modals
  • Marketing feature callouts and pricing tables

UI/UX & Contrast Best Practices

  • Use the base hue for main brand identity and the split complements for tags, badges, and secondary highlights.

CSS Variables & Design Tokens

Copy and paste this ready-to-use CSS snippet into your stylesheets:

:root {
  --base-hue: #2563eb;
  --split-accent-1: #f97316;
  --split-accent-2: #fbbf24;
}

Related Search Terms & pSEO Taxonomy

Split complementaryColor harmonyColor generatorNon clashing color generatorAccessible colors

Explore More Color Harmonies & Palettes