Design

Understanding Color Schemes & Choosing Colors for Your Website

By October 8, 2015 No Comments

Choosing an effective color scheme for your business website can be a difficult decision. However, by learning the basics of color theory and experimenting with color tools available on the web, you’ll be able to choose harmonious color schemes and palettes on your very own!

So what is color theory anyways? Color Theory is based upon the principal guidance of color mixing and the visual effect of a specific color combination by use of a color wheel. The traditional color wheel called the color circle was based on red, yellow and blue. But over the years, the color circle has evolved into the color wheel which presents a larger range of colors and more importantly the relationship between primary, secondary and tertiary colors.

  • Primary colors are made up of 3 pigments: red, yellow and blue. They can not be mixed or formed by any combination of any color. But all other colors come from mixing these colors.
  • Secondary colors are green, orange and purple. These are formed by mixing the primary colors.
  • Tertiary colors are yellow-orange, red-orange, red-purple, blue-purple, blue green and yellow-green. They are formed by mixing a primary color and a secondary color.

Color Wheel

By using a color wheel we are also able to determine harmonious color combinations with any 2, 3 or 4 colors. These harmonious color combinations are called color schemes and are comprised of Monochromatic, Analogous, Complementary, Split Complementary, Triadic and Tetradic.

  • Monochromatic color scheme is comprised of tints, tones and shades of a single hue.
  • Analogous color scheme is a group of 3 colors that are adjacent to each other on the color wheel.
  • Complementary color scheme is made from 2 colors that are opposite each other on the color wheel.
  • Split-Complementary color scheme is a variation of the complementary color scheme that uses 2 colors adjacent to it’s complement.
  • Triadic color scheme use colors that are evenly spaced around the color wheel.
  • Tetradic color scheme uses 4 colors arranged into 2 complementary pairs.

Color Theory

To understand color theory better, you’ll also need to understand warm and cool colors. Warm colors are the yellows and reds of the color spectrum that transmit happiness and energy. Cool colors are the blues and greens of the color spectrum that convey calmness and peace. The color wheel itself can be easily split to determine where warm and cool colors start and end.

Now that you have a basic understanding of color theory you can start experimenting with color tools that are available online! I’ve gathered together a list of some awesome tools to help you perfect your color scheme choices.


Online Color Scheme Generators

Coolors

Coolors is a super easy and fast color scheme generator. The generator loads 5 harmonious colors to create a new color scheme. If you don’t like what it comes up with then just hit the space bar and fly through endless color possibilities.

coolors


Adobe Kuler

Adobe Kuler has a few nice features. You can choose to browse through already created color schemes by sorting through themes or searching key words. You can also generate your own color scheme by using the color wheel. This is great if you have a color in mind and your looking for complementary colors or other color rules.

Adobe Kuler


Flat UI Colors

With Flat UI being one of the most popular trends, this website will ensure that you’re selecting the most popular Fat UI colors. You’ll have to be a bit more careful about what colors you pair together. But most of these colors look great together anyways!

Flat UI Colors


Color Scheme Designer 3

Color Scheme Designer 3 is a great designer tool for creating color combinations that work well together. This tool works great for random color generation but is even better for when you have that specific color in mind. This tool will help you come up with a harmonious color scheme to go along with any color!

Color Scheme Designer 3


Pictaculous

Pictaculous is a color generator that lets you extract a palette of colors from any image. This tool works great when you have a picture in mind but don’t know what colors you should pair with it.

Pictaculous


Have you used any other color scheme generators? I’d love to hear about them below!

Executive's Guide to Web Development

80 pages of topics and tips to navigate your way to a better website.

Leave a Reply