Using Colors On A Website

Choosing the right colors for your website is just as important as selecting graphics and content. This article discusses what factors to consider when selecting your website colors.

Colors have many effects on people. Certain colors can invoke specific emotions in people. Emotional reactions can affect the image of your company in the visitors mind and can have a major effect or your company’s “brand”.


If you doubt color evokes emotion, consider the phrases, “green eyed monster” “seeing red” or “in a black mood”. The green-eyed monster is a reference to jealousy, seeing red means a person is angry and a black mood refers to depression. People do associate colors with specific moods. Scientific texts have proven that different colors can make people happy, sad, relaxed, excited, angry or afraid.

Anything that can evoke those responses in people needs to be looked at carefully when designing your website. Colors tend to be classified as “neutral, “warm” or “cool”. So, let’s take a look at some of them.

Neutral Colors

Whites – Whites stand for purity and cleanliness. In eastern cultures white is the color of death while in western cultures in is the color of marriage and hope.

Grays – Grays exude reliability and conservatism. Shades of gray are one of the most popular colors for business attire.

Browns – Browns stand for the earth, home and family.

Blacks – Blacks tend to signify power, elegance and sophistication. In western cultures also stands for death.

Warm Colors

Reds – Reds are good for attracting attention. That is why they are frequently used in sales letters to emphasize specific points. Red symbolizes, anger, violence, lust, passion and can actually raise people’s blood pressure.

Yellows – Yellow can mean weakness or cowardice as well warmth and happiness.

Oranges – Orange is associated with fall harvesting and Halloween. It can also stimulate a person’s appetite.

Pinks – Pinks usually symbolize innocence, femininity and romance.

Cool Colors

Blue – Blue has a calming effect on people. It exudes intelligence and trust. It is a surprising that many financial and health care institutions use blue themes. Blue can also suppress appetite.

Green – While the green stands for jealousy, greed and inexperience, it also stands for money and wealth.

Purple – Purple tends to symbolize creativity. The darker shades were once reserved for royalty and the lighter shades are usually associated with romance.

Web Safe Colors

Vacuum tubes, LCD and Plasma screens all display colors differently. There are 216 colors that can be displayed on every type of monitor in every web browser and will look almost identical. These 216 are called web safe colors. If consistent color is important, you should only use web safe colors on your websites.

Color Schemes

Color schemes can be composed of a single color, complimentary colors or contrasting colors.

Single Color -- Single color schemes uses several different shades and intensities of a single color on a white background. For example, if you want to use a red color scheme, you can use everything from the lightest pink to a red so dark it is almost black.

Complementary Colors – Complementary color schemes use two or more colors that look good together and create a pleasant blend that is appealing to most people. One color may be dominant and the other used to compliment it.

Contrasting Colors – Contrasting color schemes use two or more dominant colors to create an “eye grabbing effect”. For example, using a dark blue page background, a deep red frame around a white background text area with black text is a typical contrasting color scheme.

Web designers need to be careful when using contrasting colors because some combinations tend to “vibrate” such as red text on a blue background and can hurt some people’s eyes, while other combinations are just had to focus on. Other combinations “clash” and are unpleasant to look at.

General Color Guidelines

The following guidelines are suggestions that should make your web pages readable for everyone.

  • Text should be readable. Obviously black on white is the default choice but others are also good. White or Yellow or other light colors work on black or any other dark color background. But, Yellow, Green or Gray on white does not.
  • Use colors that are attractive and pleasing to the eye.
  • Select the colors that portray the image you want to give your visitors.
  • For consistent colors across different browsers, use web safe colors.
  • Do not use a normal color intensity images as a background behind text. It makes it difficult to read. If you use an image, use it as a faded watermark.
  • Colors should be uniform on all your web pages to create a “brand” for your site and let your visitors know they are still on your website.

When you come to designing your website, choose you color scheme just as carefully as you choose your graphics and content. The overall appearance will determine the impression the visitor gets of your company and can mean the difference between success and failure.

Author: Warren Baker, Internet business consultant.

Contact us for any of our services or for any other kind of web related service you may need. If you can imagine it, then we can do it!