Skip to content

Complementary Color Finder

Find the true complement of any colour, and the near ones.

Your colour

The scheme
The colours appear here

Quick Tool Overview

The Complementary Color Finder gives you the true opposite of a colour and the split-complementary pair beside it, each drawn as real interface elements and scored for contrast — because a striking pair of swatches is often an unusable pair of colours.

What it does
Finds the complement and near-complements
You give it
One colour
You get back
The opposite, the split pair, and contrast scores
Best for
Choosing an accent to sit against a brand colour
Color Tools Free, unlimited use No sign-up Runs in your browser

About the Complementary Color Finder

The complement of a colour is the one directly opposite it on the wheel — 180 degrees of hue away — and it produces the strongest contrast two hues can have. This finds it for any colour you give it, and shows the near-complements alongside.

The near ones are usually the better answer. A true complementary pair is intense to the point of being uncomfortable across any large area, because the eye cannot settle on an edge where the two meet. Split complementary — the two colours either side of the true opposite — keeps almost all the contrast without the vibration, which is why it is the scheme most designs actually use.

Because a complement is only useful if you can put text on it, every pairing here is scored for contrast as well, and shown as a real interface sample rather than two squares: a button on a background, a heading over a panel. That is where a pairing that looks striking as swatches often turns out to be unusable.

Key features of the Complementary Color Finder

Split complementary too

The two colours either side of the true opposite, which keep the contrast without the vibration.

Shown as interface

A button on a background, a heading over a panel — where a pairing that looked striking often falls apart.

Contrast scored

Complementary does not mean readable. Two opposites at equal lightness score close to 1:1, and the tool says so.

The vibration explained

Why complementary pairs at equal lightness shimmer, and the one change that removes it.

Copy the scheme

Any single colour, or the whole set as CSS.

How to use the Complementary Color Finder

  1. 1

    Enter your colour

    A brand colour, or anything you are building around.

  2. 2

    See the complement

    The true opposite, with the split complementary pair beside it.

  3. 3

    Check the pairing

    Each combination is drawn as real interface elements and scored for contrast.

  4. 4

    Take the one that works

    Copy any swatch, or the whole scheme as CSS.

Frequently asked questions

On the RGB wheel the screen uses, it is cyan. On the red-yellow-blue wheel taught in art classes, it is green. Both are right within their own model; this tool uses the RGB wheel, because that is what a screen actually displays.

Reviews of the Complementary Color Finder

What people who use the Complementary Color Finder think of it. Reviews come from visitors and are posted as written.

No ratings yet

Yours would be the first.

  • 5 0 reviews rated 5 stars
  • 4 0 reviews rated 4 stars
  • 3 0 reviews rated 3 stars
  • 2 0 reviews rated 2 stars
  • 1 0 reviews rated 1 star

Write a review

Used this tool? Your rating helps the next person decide.

Your rating

Plain text only — links, email addresses and HTML are not accepted. Your name and review are shown publicly; nothing else is collected. See the privacy policy.

0 reviews

Newest first

No reviews yet

Be the first to rate the Complementary Color Finder. It takes half a minute and no account.

Write the first review

More color tools