Color Congruence

/, Design/Color Congruence

Color Congruence

Choosing the right colors for any design

If you think about it, we match colors everyday when we get dressed (some people might be better at it than others) and most times it’s an easy process of our daily routine. So, shouldn’t it be just as simple when choosing colors for a design? You would think so, but using the wrong color or scheme, might mislead or completely disinterest your intended audience. For example, you wouldn’t want to introduce a bright neon color when advertising for a funeral home, nor would you want to use subtle, subdued colors when designing a brochure for kids clothes. So, prior to any project, either simple or complex, it’s important to decide what palette you’re going to use.

Enter Color Scheme Designer

To take out all the guesswork, head on over to Color Scheme Designer and start your color picking process.

Colorful, isn’t it? As you can see, just by clicking on the color wheel on the left, basic colors start to match up on the right. You’ll see the main color you picked along with four other colors in the same monochromatic color scheme. So, if you pick a medium green, like I did, you’ll get two light and two dark greens to go with the medium already in place. If you just want your design to use only greens, then you’re all set. However, if you’d like to use green along with another color, then at the top, click the Complement wheel icon. You’ll see pink is the complement to green. Please try to avoid this combination when picking out a shirt and pants. The complementary color is always directly opposite your color choice on the color wheel. Also, you can see I switched over from the color wheel view to a color list view. You can do this at the bottom of the page by click on the tabs. Hues = Color Wheel, Color List = Yep…Color List.


Let’s say you want to stick with green as your primary color, but aren’t really thrilled with the pink complement. Don’t worry, you have other choices. One click over to the right from the Complement wheel icon, is Triad. Now your green is starting to branch out and you’ll be provided with other hues that are secondary to your medium green. These seem much better, don’t they? The Triad option will give you your primary color choice, plus two secondary colors that go with it and lights and darks of each.

Moving over to the Tetrad wheel icon, you’ll be given two secondary matching colors as well as your complementary color. Starting to look a lot like Easter.

The next option is Analogic. This will display colors that are adjacent on the color wheel to the primary color of choice. So, basically matching colors that live in the same neighborhood, but not the same street.

The last option is Accented Analogic. This is similar to the previous option, but here you get your complementary color back as a nice accent. Doesn’t look too bad now.

Once you’re happy with your choices, you can easily save your colors and their values by selecting Export at the top right of the page. You’ll have several options to choose from. I chose HTML + CSS. Another page/tab will pop up with all your color information and you can save this page for later reference. (Use the “Save/Save As” command in your browser or right-click and choose “Save As”). Very handy to have all your color stored somewhere and now you can begin your design project.

More options

The site has a handful of other options you can use, like using web safe colors, adjusting for color blind, and the ability to adjust your scheme’s saturation/brightness or contrast, but just try to keep it simple for best results.


About the Author:

Leave A Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.