How to Pick The Right Colors for Your Website

It’s important that you have the right color scheme, besides having a good looking theme. In fact a good looking theme can easily be overshadowed by a bad color scheme. It’s very important that you pick the right set of colors for your website. They have to fit the subject that you are talking about.

There are several different color picking tactics and we’re going to go through some of them. After you’ve read this article you will find it much easier to create a color scheme that fits your website perfectly, as well as colors that complement each other, instead of “battling”.

Most Themes Come With Prefedines

Most of the themes nowadays come with different designs and different color schemes. These are picked by the developers as fitting for the theme and its purpose. When you combine the few demos with the color schemes that are also predefined, you get tens of different website layouts.

The bad side of combining predefined designs is that they are all the same. If you get a popular theme, chances are that there are already dozens of website which look and feel just like yours does. This is especially bad if you have a business or portfolio theme – you want to create a website which is going to grow into a brand, not become anonymous.

We do recommend that you stuck with the predefined designs if you have no idea how your website should look. Sometimes it’s better for a website to stay with the predefined design – at least you’re sure that it looks good.

Color Pickers

The themes that come with predefined color schemes most likely have color pickers. Those are little tools that allow you to choose the colors of different elements in the theme. Some of the color pickers go into advanced mode and allow you to pretty much change any color you want (text, background, boxes, menus, footers, headers, and more minor details) and there are those CPs that only allow you to change the colors of the more basic things – menus, backgrounds, etc.

It doesn’t really matter which one you are going to stumble upon. You just need to observe the predefined color scheme and notice which the main colors are. Even though the advanced builders will have tens of fields for picking colors for different things, most of them will be either very similar or the same. This is because it’s recommended that a website only has 3-4 colors. If you try to use more colors the website is going to become color-clogged and it will distract your visitors too much.

Now let’s take a look at color picking techniques that are going to be very useful.

One Little Note

blog_colortheory

 

 

 

 

 

 

 

 

The general rule is 60-30-10. This means that your primary color should cover about 60% of the website. The secondary color should be about 30% and the tertiary – 10%. If you pick more colors, your primary one shouldn’t be less than 50%, and your secondary shouldn’t be less than 25%. The third and fourth (and so on) colors should be around the same percentage. This is a very good rule to follow. When you visit some of the more popular websites you will see that they are following it as well.

Another thing that you should think about before picking your colors is how you will connect the colors and the subject of your website. For instance, if you are a creative, vivid colors are going to fit you quite well. But if you want to create an online store, or a church website, vivid colors aren’t going to do the job, because they will distract the user from the purpose of the website. For the latter two you should use light and calm colors that aren’t irritating to the eye.

The Color Wheel

Color_wheel

 

 

 

 

 

 

 

 

 

 

 

Some of the best color pickers will give you a little wheel with lots of colors in it. As you guessed, this is called the color wheel. It’s a good representation of the colors when you are trying to pick ones for your websites. Why is it good? It’s good because it easily allows you to find out which colors fit each other and which will not do the job.

For instance, our first technique is opposites attract. This means that the two colors that are opposite to one another on the color wheel will have great compatibility. Choosing opposites for your 60% and 30% is a great idea. This works because there is high contrast between the two colors. And when you keep in mind that you are also able to choose light colors that don’t irritate the eye, this makes it a perfect technique for picking colors in general – for furniture, clothing, as well as websites! Opposite colors are great both for websites which want vivid colors and for websites which want to have a calming effect on its visitors.

If you want your website to be colorful and you want to pick colors that are vivid and gay, you should go for the neighbors tactic. Pick a strip of the wheel. The two strips that are next to it have colors that are perfect if you want your website to have lively colors. The thing is that they look alike and they blend into one another without being anonymous.

Did you notice how the whole wheel is created from rings that are getting smaller and smaller (or bigger and bigger, depending on your perspective). Those are all colors that are compatible with each other. First pick a ring and then you have some dozen colors that are all compatible with each other. This is a great way for picking colors if you want to pick three, or more.

The last technique is very simple. If you want to pick 3 colors, imagine an equilateral triangle. The three points that the equilateral triangle has on the color wheel are the colors that are compatible with one another. Most of the better tools will include this triangle to help you visualize better. However, it won’t always be present, so you might have to activate your imagination a bit.

 

Post A Comment

Your email address will not be published. Required fields are marked *


1 + three =