Site hosted by Angelfire.com: Build your free website today!

The Use of Color in Web Design

Color MoodKeyboard

I've always wondered how websites can have so much color. Here are a couple websites that I have discovered about color design: Pyschology of colors shows you some of the emotions/feelings associated with color; Designing with colors shows you color wheels, HTML color codes, and color charts.
Color on a Web site is a great to improve your Web design. Color schemes are important on Web pages, but it is very easy to get carried away with using lots of different colors. There are four basic color schemes that you can use on a Web site: monochromatic; analogous; complementary; and triadic. Here is a Web site I found on the basic Color Schemes.
Color symbolism is also very important. You have to consider cultural differences, age differences, class differences, gender differences, and trends. For example many nurses dress in light blues and pale pinks because these are calming, soothing colors, and upset patients relax a little in their presence. Here is a Web site I found on Color Symbolism.
Here are some examples of how color changes moods:
Pink - soothes
Yellow - cheers, increases energy
White - purifies, energizes
Black - disciplines, strengthens
Orange - cheers, commands
Red - empowers, stimulates
Green - balances, refreshes
Purple - comforts, spiritualizes
Blue - relaxes, cools
Bright colors are good attention grabbers because they are loud and obvious. You have to be careful not to have to many bright colors otherwise the page becomes an eyesore. Colors that are close together on the color wheel are good to use for subtle changes.
You must be able to read the text. If the text is light colored then the background has to be dark and vice a versa. White and black always make a good combination, and red and blue are useful for highlighting. Try to avoid using the combination of black as a back ground with warm color text, as it might be great clarity wise but has a tendency to make visitors nauseous.
Warm colors are based on yellows, oranges, browns, yellow-greens, and orange-reds, colors. Warm colors have a tendency to be aggressive and exciting, so it's best to apply them in small doses. Cool colors are based on blues, greens, pinks, purples, blue-greens, magentas, and blue-reds. Cool colors tend to be soothing, calming colors and can be used in large amounts.
Neutral Colors include white, black, gray and colors that contain a large amount of gray. Neutral colors are great for back-grounds and for enhancing the effect of warm colors.
Here is a Web site on setting the Mood with color.
An important design issue with using color is to create the background and foreground with enough contract to make the content legible. Not enough contrast makes it hard for readers to read the text, but to severe contrast can cause a headache.
Links should stand out from the body text, even after it has been clicked on. Make sure the link colors doesn't turn into the surrounding text color or blend in the background.

Top of Page