Color is a very complex topic. For website design purposes, it’s best to keep the color palette simple. Many pre-designed website templates or themes are preloaded with carefully selected colors that reflect the theme of the site. When you are in a position to custom design the colors, there are several factors to consider.

Website background

Some websites are designed with a page width narrower than the background which fills the browser’s screen. A different color background vs. the page will set the page off and give it more dimension. Backgrounds are usually image files that can be monochromatic, gradient fade, textures or actual photographs.

Select a Palette

It is best to select a primary color that is often the background of your pages (unless you choose to have a white background) and have 2 complimentary colors that act as accents for heading, tabs, or other graphic elements that are repeated on all of the sites pages.

Font Color

Fonts must contrast sufficiently to be easily read against the background which is why many sites choose to use white as the background.

White, Black and Gray

A white background is simple, clean and allows other colors to contrast with the large area of white as the background. White also allows for images with a white background to appear as transparent backgrounds saving much tedious Photoshop work to create transparent background for images placed onto a colored background.

Gray is a very common color when used with white as it shares a blend of black and white. Often it is shown as a gradient that fades from white to the darkest area of the gray.

Black is mostly used as a background color and primarily intended to create a mood that black evokes which suggests depth, drama, stillness, power. White fonts or very light and bright fonts must be used against a black background.

Color has a psychological effect on people and can create certain feelings and moods. People respond differently to colors and there are gender differences on which colors are the most popular. So before picking a color scheme that YOU like, think about your target market and decide which color combinations would fit the theme and niche of the site.

Color Symbolism

Reds: energy, passion, danger
Blues: calmness, cool, tranquility, stability
Greens: growth, nature, freshness, vitality
Yellows: happiness, playfulness, sunshine, on sale,
Browns: stability, earthy, autumn
Blacks: quiet, mysterious, power, deep

Symbolism in color is subtle and used be used in conjunction with graphics and imagery to bring out the underlying feelings and mood that they can convey.

Color Codes

Colors used on websites are basically called ‘web safe’ and include 256 variations. These colors have designed names such as Dark Olive, Light Khaki, etc. These colors and non websafe colors are represented by the RBG system or RED, BLUE, GREEN mixture. White for instance, is represented as #FFFFFF. The first two letters represent the amount of Red, the second two letters represent the amount of Blue and the last two, the amount of Green. Red is shown as #FF0000.

There are various color picker tools available on the internet that one can use to determine a color code so that you can develop a color palette or to provide a code number to your website designer.