How To Choose A Color Scheme For Your Website

Choosing a color scheme for a website, a graphic, a software package, or any type of advertising can be difficult, especially if you don’t have a strong background in art or design. In this quick post, I'll show you a suggested workflow for choosing colors and will also give you some great resources that will teach you more about color theory, color pyschology, and the proper application of color so that your project will be accessible to all users.

There are many places on the web that will help you mix-and-match a color palette. Everything from color wheels and color pickers to hex color charts and lists of all named HTML colors. In fact, there are entire design communities that revolve around and celebrate color. Adobe Kuler, ColourLovers, Color Scheme Designer, ColorMatch5K ColorJack, and ColorStream (iPhone app) are just a few of those communities and tools that you can use to look for inspiration or for creating that perfect color scheme.

Color Theory

Beyond just suggesting communities and tools related to color, you may benefit from learning about color theory and why and how colors should be combined and chosen.

It's important to understand which colors should be used as background colors, highlights or accents, and text. The following technical resources will teach you about color combinations, choosing the right contrast and luminance, and how to apply those techniques to your designs :

Color Pyschology

There is more to color than just the technical application of it. Also relevant is the psychology and cultural meanings behind choosing colors. You might be surprised to find that color meanings change from culture to culture and even in different contexts within the same culture.

Accessibility In Color

One other consideration is making sure that your website or application works for colorblind users. Because some form of colorblindness occurs in a significant percentage of the population (about 7% of U.S. males and 0.4% of U.S females), designers must be very careful if they convey meaning by color alone. Understanding the different forms of colorblindness and knowing how to circumvent each type will create more accessible designs that won't frustrate colorblind users.

See the following resources for more information on colorblindness and how to design for it:

How To Choose Your Colors - A Sample Workflow

The above resources should give you a lot to think about, but I don't want to leave you paralyzed with too much new data. To avoid information overload, I'd recommend something like the following workflow for choosing colors for your project:

  1. Write down a list of words and concepts that you want to describe your project, i.e. how you want it to be perceived. Examples would be: professional, edgy, soft, comforting, reliable, etc.
  2. Look up 1-3 colors that represent some of the most important concepts you wish to convey.
  3. Pay special attention to cross-cultural differences for color meanings when selecting your color or colors.
  4. Use one of the classic color scheme types outlined in the resources above to choose your full color palette.
  5. Stick to your color palette. If you add more colors, it can make your project seem just a little "off" or cluttered.
  6. Test your color scheme by asking 3-5 users in your target market to use your project or to look at screenshots and then write down how it makes them feel and what perceptions they gain about it, just by looking at it. Then compare the findings to your original word-list. Rework if necessary. Note that factors other than color like layout, copy, etc. may influence their list. To isolate the test users' feelings about the colors, present the color palette only.

Tags

  • Benjamin Kuker

    Benjamin Kuker

    Benjamin Kuker is the co-founder of Virtuosi Media and is married to his beautiful wife, Johanna. He is responsible for the design and maintenance of this website. He enjoys reading, writing, programming, business, sports, and traveling.

    View Benjamin's Bio

Help us spread the word.

Your Comments Are Valuable - Join The Discussion!

Here's the latest in design.

Check out our most recent design tutorials and resources.

Popular design tutorials.

Here are our most popular and useful design tutorials.

We're on the web.

We are where you are. Discover great content by becoming our fan on Facebook, following us on Twitter, or subscribing to our RSS feeds.

 

Copyright 2011 Virtuosi Media Inc.