Curated by: Luigi Canali De Rossi
 


Wednesday, April 30, 2003

How to Select Perfectly Matching Color Combinations

Sponsored Links

A Free Mini-Guide by Robin Good

One of the most difficult tasks for visual communicators is selecting harmonious color combinations. Though we all feel we have the capability to select appropriate colors — in reality we've realized that's not true and it's difficult for those without a design background to find good color matches.

In consolation, perfect color combinations are the results of perfect mathematical equations. Exact and precise differences in light tone, color and saturation create pleasing and harmonious combinations, just like the ones great master artists have created.

Apply this knowledge along with interactive learning and visualization tools and you start find perfect color matches and combinations.

Thankfully, a few people have done this work and you can enjoy the thrill of interactive visual color matching by using unique tools.

Here are three gems to facilitate selecting perfect color combinations:

a) Sessions.edu - Color Calculator

b) Color-Wheel-Pro

c) Colorimpact

If you know of others, please share them in the comments section where others have been mentioned. Also, we include recommended readings at the end of this mini-guide. If you ever need to refer to color-related definitions and terminology, a great place to start is Wikipedia's color entry.


a) Sessions.edu - Color Calculator
http://www.sessions.edu/ilu/
Free

This valuable and beautifully designed interactive Color Calculator helps you find perfect color combinations in a snap. A color wheel provides full color spectrum and several mathematical models to find the right color complements. Sample combinations are interactively displayed and RGB, CMYK and Hexadecimal codes for every color are available for exporting to other tools.

The Color Calculator is a great and easy-to-use tool that makes finding perfect color matches as easy as possible. It might be more difficult to decide which one of the infinite possible combinations you prefer.

The only weakness in this tool is that it doesn't allow directly entering a pre-selected color with specific RGB/CMYK/Hex codes. If you already have a precise color you want to start with, then this tool will be hard to use.

You're required to enter your name and email address to access the color calculator at http://www.sessions.edu/ilu/.

Price: Free

Highly recommended.


b) Color-Wheel-Pro
http://www.color-wheel-pro.com/
Free to try

When she couldn't find anything that met her needs, Nicole Ross designed Color Wheel Pro. It's an application for interactively creating various color schemes and previewing them on real-world examples like Web sites, product packaging and logos.

The preview occurs in real-time. When adjusting the color scheme, you immediately see your changes on the available samples.

The approach is the same one used on the Sessions.edu Color Calculator — an interactive color wheel providing access to mathematical color combinations. You can save and "preview" different color "presets" applied to the several sample designs.

Color Wheel Pro includes all the classic color schemes: Monochromatic, Analogous, Complementary, Split Complementary, Triadic, and Tetradic. It's also possible to create custom, or so-called "freeform" color schemes.

However, it's not possible to load your own designs and see the color combinations applied. Even though that would fantastic, the technical issues make it impossible.

The best thing in this tool is a well-written help file containing useful information about color and its characteristics. This alone justifies the price of Color Wheel Pro.

One area where Color Wheel Pro needs improvement is to let the user to easily view and export color codes and to enter them using numeric values, if needed. This is a useful and easy-to-use tool. Try it out by downloading a free 30-day evaluation at:
http://www.color-wheel-pro.com/

Price: USD $39.95

Recommended.


c) ColorImpact
http://www.tigercolor.com/
Free to try

Meet the Rolls Royce of color matching tools.

ColorImpact is the best professional tool available for creating harmonious color schemes. It offers all of the best features from all of the other color matching tools available in one nice package. It's intuitive, reliable and full-featured.

With its highly visual user interface, ColorImpact brings effective color theory into action with a mouse click. The application is targeted to professional multimedia and Web designers, but novices and beginners can easily master it.

Many color formulas are already built-in and include triads, complements and analogous colors. You can design your own custom color formulas to explore advanced or alternative color combinations. You can export color schemes as Photoshop palettes, CSS files or the clipboard for pasting into your favorite design application.

ColorImpact offers many advanced features that will make any designer happy. These include:

a) The quality and variety of available interactive test patterns.

b) The "variation" palette feature for exploring variations of the current color palette. See how a color scheme looks when you make the colors lighter, brighter, darker, more saturated, less saturated, warmer or cooler.

c) The undo feature that can go back 100 steps.

d) Color Formula Editor for creating custom color combinations.

e) An integrated color picker for precise sampling of color references from images, Web pages and other documents.

The program includes many features for quick access from Photoshop, Dreamweaver, Fireworks, FrontPage and other applications.

A feature tour is available at:
http://www.tigercolor.com/Features1.htm

You can download a 14-day free trial at:
http://www.tigercolor.com/Download.htm

Price: USD $49.95

Must have.

Editor's comment:

Developers can build tools that let the user design a simple layout with pre-packaged modifiable components for trying different color combinations.

At the next level of sophistication, the design support tool "scans" your prototype document and creates a dummy layout page that reflects the generic components you have used along with their sizes and positions. For example, add a big title in the top center, two bars of colors at the bottom, three columns of text, a figure in the middle and so on. After finishing the dummy layout, testing and trying out new color combinations becomes a fun and easy task.

Other tools:

  • ColorSchemer Studio is a color matching application that helps you explore color using a visual color wheel. You can mix colors, create gradients and analyze contrast and readability. A Mac OSX version is available.

    You can take a Flash tour of the application [opens Flash file] and this matrix compares Color Schemer and Color Schemer Studio. Demos are available. Color Schemer ColorPix is a free Windows application that grabs a pixel and transforms it into different color formats.

    Price: Color Schemer Studio (Win and OSX): USD $49.99. Color Scheme Studio OSX: USD $49.99. Color Schemer (Win only): USD $34.99. 15-day trial available. See the Web site for student and teacher discounts. Color Schemer ColorPix (free), Color Schemer Galleria (free) and Color Schemer Online (free).

  • ColorBlender is an online tool for color matching and palette design. After selecting a preferred color, the application automatically calculates a 6-color matching palette (a blend). Blends can be saved to future reference.

    Once you discover a blend you like, you can download it as a Photoshop Color Table (.act) or Illustrator Colors (.eps) file or email the blend. If you don't have a preference, load a random blend for inspiration. The tool can suggest a PANTONE match. The online help provides more information about ColorBlender.

    Price: Free

  • Colorcell is an online system for finding the most popular color combinations through a community effort. Each cell is composed of four single colors and the combination of the colors in a cell makes its character.

    The introduction and frequently asked questions provide a detailed explanation how how the cells live and die in the virtual livingspace of 100 cells. A user can vote for one to three favorite cells per day, or click the cell to get its details.

    The statistics provide an overview on the number of cells created, died, alive, selected and average fitness. The tool has been in existence since March of 2002. This unique community application isn't about finding perfect color combinations, but seeing what colors are most popular with the community.

    Price: Free

  • Colr is a web-based color playground where you can play with colors and words. Pick a color and enter a tag of what it reminds you of. For instance, looking at green makes you think of grass. So you add "grass" as a tag.

    You can remove tags you don't like, but they're not gone for good. Each color has an "H" for history that shows all the added and removed tags. You can also add the tag back to the color.

    Price: Free

  • Colors on the Web is a site focused on using colors in web design. It covers color theory, the color wheel, color combinations, color physics, color psychology and more.

    The site comes with a Color Wizard that generates matching colors based on a selected color. You can also spin the Color Wheel to get new ideas. Ask questions and discuss color ideas in the Colors Forum.

    Price: Free

  • MasterColors contains a Masters Colors free online color seminar that comes with six lessons, templates and Photoshop files for downloading. The company also offers HVC Color Composer, a color design tool available for Macs and Windows. It requires specific versions of Photoshop or Photoshop Elements.

    Download the free demo. There are two versions: Standard and Pro. Pro has all the same features as standard, plus you can save palettes as Photoshop palette files, more palette creation options and measure contrast. Also note there are two versions of standard: one is a plugin for Photoshop and the other is a plugin for InDesign.

  • Price: HVC Color Composer Professional, Photoshop Plugin: USD $129.95. HVC Color Composer Standard, Photoshop Plugin: USD $49.95. HVC Color Composer Standard, InDesign Plugin: $49.95.

  • Color Scheme Generator 2 creates different types of color schemes based on one color, which uses algorithms to find other colors that supplement the base color using the color scheme of your choice such as monochromatic, contrast, triad, tetrad and analogic. The help page explains the process and provides other information including downloading the application.

    Not only do you find different color schemes with Color Scheme Generator 2, but also you can see how they look to people with various types of color blindness. Each type of color blindness is accompanied with population information -- how much of the population has the condition. Just pick one condition and the color scheme changes.

    The application immediately displays variations of your selected color scheme. Choices include pastel, dark pastel, light pastel, contrast and pale. You can enter RGB values (six-digit hexadecimal code). You can save the URL of your scheme for later use.

    Price: Free

  • Daily Color Scheme adds a new color scheme every day. Download, bookmark and learn about the color scheme that appears on Daily Color Scheme (being updated). You can download the scheme as Photoshop Color Table, Illustrator file, ColorSchemer Studio file, CSS (cascading style sheets) file, HTML file or a zipped file containing all formats.

    Scroll down to view archived color schemes or to search for a color scheme. An RSS feed for the site is available or subscribe to receive a daily email with the color scheme of the day. For more information, check out the support forum.

    Price: Free

  • Recommended readings:

  • Setting the Mood with Color by Sean Glithero

  • Color My World by Molly E. Holzschlag

  • Color Design for the Web by Vaishali Singh

  • Color Theory by Meryl K. Evans

  • Color Matters, a Web site with many articles in tips on color.

  • Color Worqx has a color tutorial, palette picker and list of resources.

  • wg on Web-based color pickers provides information on many Web-based color picking tools. Beware the article is a few of years old, but it has good information.

  • Wink Search Results lists many quality resources and tools for color matching.

  • Understanding Color Profiles by Dave Johnson is more about digital photos and the information might be valuable to you.

  • Secrets to Using Color on Your Website and Common Pitfalls to Avoid by Michael Turner provides three common traps to dodge when it comes to using colors on a Web site.



    Updated December 26, 2006

  •  
     
     
    Readers' Comments    
    2009-10-09 03:50:50

    ninpo

    Hi Robin! Im very thankful for all this info you provide. Its very helpful. Im looking forward for your next post.



    2009-01-28 00:18:44

    Mike Wofsey

    Hi Robin,

    I manufacture a color tool which I (humbly) think is the best there is. It has a full CMYK color wheel, a color map with hundreds of tints and variations, a color directory with "street" names for colors and cmyk formula, and finally an emotional color guide that shows the emotional impact of colors in the spectrum along with two, three and four color matching combinations.

    The tool is called the Galaxy Color Map Pro, and you can see an image of it here:

    http://www.galaxygauge.comcolor.html

    and if you look at the bottom of the description you can load a full-page image of it.

    Also, I think the price is right.

    Thanks for the excellent articles. I bought a Canon FS100 on the strength of your review, and it is a terrific camera.



    2008-04-01 04:00:09

    Giovani Spagnolo

    Hi Robin :-)

    Here are some more interesting color tools I am using for our prototypes:

    http://www.wellstyled.comtoolscolorscheme2index-en.html
    http://www.colorjack.comstudio#
    http://kuler.adobe.com

    And a color checker to see how disabled people look at your sites: http://www.vischeck.comvischeckvischeckURL.php

    Cheers,
    Giovani



    2007-12-02 18:19:03

    CB

    I have found the links in the article to be broken. Can someone advise me if the Andrew Mundi website is still active???



    2007-05-18 10:23:05

    J.A. Dalman

    Make color matching simple by using Tintbook. Predict CMYK color with confidence for your printing projects by using the pre-printed formulas that work with ALL graphic design software. Pages with vital color viewing and color management material are found throughout each volume. Graphic Designers and Printers are calling Tintbook a lifesaver. http://www.tintbooks.com



    2007-03-26 01:20:45

    Rachit Dayal

    Great article there Robin. Actually I have something to add to your findings ...

    One of the challenges I have with color-wheel based applications is that the generated colors are bright and outstanding. While that's great for highlights ... that's not so good for backgrounds and object coloring (where more natural colors please the eye more).

    If I may offer an alternative, one of my clients has developed a tool that tends to explore more mild, harmonious colors and palettes. And I think exploration of more "natural" alternatives is more useful for designers than color wheel suggestions.

    For color enthusiasts, the tool is free and available at http://www.genopal.com/online.htm

    thanks for listening to my rant ... hehe :)



    2007-01-28 02:16:57

    Rajavanya

    Hey gr8 info man... especially the sessions.edu was cool...

    I mean the second link



    2007-01-22 01:45:53

    bineesh

    i want a good tool for colour selection



    2005-07-14 14:09:06

    Robert Gremillion

    We created a website called ColorCombos.com (http://www.colorcombos.com) that your readers may find useful.

    Robert



    2005-04-16 14:09:44

    Vitaly Friedman

    Hi, thanks for a nice article.

    I guess that the list "Bookmarks for web-developers" (http://www.alvit.de/vf/en/00_webtools.html) might be also interesting for web-designers, search for matching Color Combinations.

    With best regards,
    Vitaly Friedman,
    http://www.alvit.de/vf/



    2004-12-10 06:00:43

    Mark

    I find this color tool very useful because I can cut and paste codes back and forth from PhotoShop. It has as many features as the paid ones.



    2004-06-04 05:42:10

    Sean

    I have also found these two utilities very useful:

    -ColorSchemer

    -ColorShade

    They are not as full-featured as the mentioned programs but they are a lot easier to use and have some very cool features.



     
    posted by Robin Good on Wednesday, April 30 2003, updated on Tuesday, May 5 2015


    Search this site for more with 

  •  

     

     

     

     

    789




     




    Curated by


    Publisher

    MasterNewMedia.org
    New media explorer
    Communication designer

     

    POP Newsletter

    Robin Good's Newsletter for Professional Online Publishers  

    Name:
    Email:

     

     
    Real Time Web Analytics