24
Color is undoubtedly the essential means to touch the emotions of your website visitors. It is a non-verbal communication and creates a physical and emotional reaction of the viewers. Colors are able to set the right tone and carry a necessary message for visitors. Colors can calm or excite, arouse plenty of feelings and stimulate to actions. Color is extremely powerful. When choosing a color scheme for a website, it is important to do it right, guided by the main principles of the color theory and of course, follow professional advices.
In this article I intended to cover the most important aspects of color, the main principles of combining colors, its meaning in web design as well as symbolic meaning. Also, you will see some good examples of well designed websites divided according to the prevailing color as well as get familiar with some useful tips from professional designers as to using colors effectively when creating a website. So, lets start discovering the magic of color
Source: sustland.umn.edu The color wheel is an indispensable attribute of many designers and artists all over the world. This great tool is a perfect proof of the theory that the ingenious is always simple. The color wheel allows you to pick the colors that are harmonious together. The wheel consists of 6 basic colors: red, orange, yellow, green, blue and purple. In addition to the basic colors, we have extra colors (mixes of the basic). So, to find a right harmonious color scheme, you need to use any two colors opposite each other on the color wheel, any three colors equally spaced around the color wheel forming a triangle or any of four colors that form a rectangle (two pairs of colors opposite each other). Color schemes remain harmonious regardless of the rotation angle. Primary Colors There are three primary colors: Red (#ff0000 in HTML or #f00 in CSS), Yellow (#ffff00 in HTML or #ff0 in CSS) and Blue (#0000ff in HTML or #00f in CSS). We cannot get them by mixing any other
color. The other extra colors can be formed by combining of these three colors. If you mix two of the primary colors, you will have a secondary color. Secondary colors There are also three of them: Orange (#ff9900 in HTML or #f90 in CSS), Green (#00ff00 in HTML or #0f0 in CSS) and Purple (#ff00ff in HTML or #f0f in CSS). You can get them by mixing red and yellow (orange), yellow and blue (green) and blue and red (purple). Tertiary colors To get one of tertiary colors you need to mix one primary color and one secondary color together. The opportunities for tertiary colors are endless. Complementary colors Complementary colors are the ones that are located directly across each other on the color wheel: red and green, blue and orange, purple and yellow. In combination with each other they compose a striking contrast. Such color combinations are usually used for standing out some elements on the website. For example, if you have an orange background and some blue elements on it, the blue items will be almost blinding. Analogous colors These colors are located next to each other on the color wheel. They usually look extremely good together, but absolutely quiet. Use such color combinations when you need your visitors to feel comfortable while looking at your website pages. There are plenty of color groups that refer to various aspects of color, i.e. warm colors, cool colors, neutral colors to name a few.
Red
Blue
Hinduism : the color of Krishna Judaism : holiness Christianity : Christs color Catholicism : color of Marys robe Middle East : protection Worldwide : safe color Feng Shui : Yin, water, calm, love, healing, relaxation, peace, trust, adventure, exploration Western: Sadness, depression, conservative, bridal tradition, corporate, something blue European : happiness, hope, joy, cowardice, hazards, weakness Asia : imperial, sacred China : royalty, nourishing Egypt : mourning Japan : courage India : merchants Buddhism : wisdom Feng Shui : Yang, Earth, auspicious, sunbeams, warmth, motion European : autumn, harvest, creativity Netherlands : favorite color (House of Orange) Ireland : protestants (religious) USA : halloween (with black), cheap goods Hinduism : saffron (peachy orange) is a sacred color Feng Shui : Yang, Earth, purpose, strengthens concentration Colombia : discourages sales Australian Aboriginals : color of the land, ceremonial ochre Feng Shui : Yang, Earth, industry, grounded China : exorcism, green hats indicate a mans wife is cheating on him Japan : life Islam : hope the cloak of the prophet was thought to be green, virtue only those of perfect faith can wear green Ireland: symbol of the entire country, Catholics European/USA : spring, new birth, go, safe, environmental awareness, Saint Patricks Day, Christmas (with red) USA : money Western: spring, new birth, go, Saint Patricks Day, Christmas (with red) India: Islam Feng Shui : Yin, Wood, growing energy, refreshing, nurturing, balancing, harmony normalize, healing, health, peaceful, calming Thailand : mourning (widows) European : royalty Catholicism : death, mourning, crucifixion Feng Shui : Yin, physical and mental healing, spiritual awareness European : marriage, angels, doctors, hospitals, peace Japan : mourning, white carnation symbolizes death
Yellow
Orange
Brown
Green
Purple
White
China: mourning, death, India : unhappiness Eastern : funerals Feng Shui : Yang, metal, death, ghosts, mourning, ancestal spirits, poise, confidence European : mourning, funerals, death, rebellion, cool, restfulness China : color for young boys Thailand : bad luck, evil, unhappiness, Judaism : unhappiness, bad luck, evil Australian Aboriginals : color of the people, ceremonial ochre Feng Shui : Yin, water, money, career success, income, stability, emotional protection, power, bruises, evil
Black
Red
is mostly associated with boldness, excitement and desire. Red is the color of love, strength, power, energy, leadership and excitement. It is a strong color, and you should be aware of some its negative associations, i.e. danger, alarms, traffic lights, etc.
Blue
means patience, peace, tranquility, trustworthiness, love, stability. It is one of the most beloved colors, especially by men. It is associated with stability and depth, professionalism, trust and honor. A Stunning Blue Color Scheme for a Blog
Yellow
is the color that mostly associated with liveliness. It is energetic and gives the feeling of happiness. Also, it associates with curiosity, amusement, joy, intelligence, brightness, caution, etc. A Yellow Website Brighter than Sunshine
Orange
means cheerfulness and creativity. It can be associated with friendliness, confidence, playfulness, courage, steadfastness, etc. An Attractive and Friendly Orange Solution
Purple
traditionally associates with power, nobility and wealth. Wisdom, royalty, independence, nobility, luxury, ambition, dignity, magic and mystery. A Mysterious Design in Purple
Green
is the color of harmony, nature, healing, life, food and health. Also, it is often associated with money. A Stylish and Well Balanced Green Design
Brown
is the color of relaxation and confidence. Brown means earthiness, nature, durability, tribal, comfort, reliability, etc. It can be thought of sophisticated, solid and conventional. An Excellent Brown Colored Portfolio
Grey
gives the sense of seriousness, conservatism and traditionalism. It can provoke the feeling purity and innocence. It can be associated with security, reliability, intelligence, modesty, dignity, maturity, solid, practical, old age, sadness, quality, boring, practicality, professional, durability, quiet, gloominess. In combination with orange, grey looks fantastic and awakens the sense of perfection. A Creative Portfolio in Grey
Pink
expresses tenderness, romance, femininity, truth, passivity, good will, emotional healing, care, peace, calming, affection, emotional maturity, nurturing, sweet tasting, sweet smelling, ethereal, delicacy, etc. A Wonderful Pink Web Solution
Black
is a stylish and elegant color associated with power, sophistication, formality, health, etc. Black is an excellent technical color and helps to add some mystery to your design. But if you dont want your website provoke depressing feelings, avoid using black over a large area. On the other hand, if you make a black background, it can enhance perspective and depth. Black is great to use for art and photography websites to help other colors to vibrate. A Black Colored Business 3D Solution
White
White is associated with purity, simplicity, fresh, goodness, innocence easy, cleanliness, etc. This color is great to use for a background or accent color, because it highlights other colors. A Clean White Web Design