Explosion Tools

Split Complementary Color Finder

Generate split complementary color schemes from any hex code with shades and tints. Free, no signup, works in your browser.

Base
rgb(59, 130, 246)
hsl(217, 91%, 60%)
Shades
Tints
Split 1 (+150°)
rgb(246, 82, 60)
hsl(7, 91%, 60%)
Shades
Tints
Split 2 (+210°)
rgb(224, 246, 60)
hsl(67, 91%, 60%)
Shades
Tints

About Split Complementary Colors

A split complementary color scheme uses a base color and the two colors adjacent to its complement — at 150° and 210° on the color wheel. This creates a palette with strong visual contrast similar to complementary colors, but with less tension and more nuance. It is a popular choice for beginners because it is hard to mess up while still providing rich color contrast.

All processing happens in your browser. No data is sent to any server.

About Split Complementary Colors

A split complementary color scheme uses a base color and the two colors flanking its direct complement on the color wheel — at 150° and 210° from the base hue. This provides strong visual contrast like complementary colors but with more variety and less visual tension. Enter any hex code to see its split complementary palette with shades and tints for each color. Great for web design, branding, and any project needing rich, balanced color contrast.

Frequently Asked Questions

What are split complementary colors?
Split complementary colors are a base color plus the two colors adjacent to its complement on the color wheel. Instead of using the direct opposite (180°), this scheme uses colors at 150° and 210° from the base. For example, if your base is blue, the split complements are yellow-orange and red-orange.
When should I use split complementary colors?
Use split complementary schemes when you want contrast without the harshness of direct complementary colors. They work well for web design, presentations, branding, and UI design. The scheme provides enough contrast to be visually interesting while remaining harmonious.
How are split complementary different from triadic?
Split complementary uses angles of 150° and 210° (colors flanking the complement). Triadic uses 120° and 240° (evenly spaced thirds). Split complementary has a stronger relationship to the base color's complement, while triadic creates a more balanced, equilateral arrangement.

Related Tools

Hex to RGB Converter

Convert hex color codes to RGB, HSL, and more

CSS Gradient Generator

Create beautiful CSS gradients with a visual editor and copy the code

Color Contrast Checker

Check WCAG color contrast ratios for accessibility compliance

Analogous Color Finder

Find analogous colors for any hex code. Generate harmonious color palettes using adjacent hues on the color wheel.

Triadic Color Generator

Generate triadic color schemes from any hex code. Three colors evenly spaced at 120° on the color wheel.

Color Mixer

Mix two colors together at any ratio. See the blended result with hex, RGB, and HSL values plus a full gradient preview.