Using the RGB format and math is simple to determine that the number of existent colors is astronomical and the conclusion is obvious: we have countless colors to use in our projects. It’s true, the differences between these are sometimes too small and for some people the differences are unnoticeable, but clearly:”000000″ is pure black while “000001” is another shade, even if the difference is observed only by specialists.

In design projects, but also all around us, it is hard to find an entity using a single color; the world “is governed” by color combinations and here come the bad news: two nice colors added together isn’t a must to create a cool color scheme. In spite of the limitless colors, the correct matches between these are fewer and may not work for everyone.

In the overall value of a designer’s work, colors have an important role hence ignoring them isn’t a smart move. This article is written with the special purpose of helping web designers handle colors to their advantage even though it will be a strong “fight” against bad color combinations.

Before delving into the realm of color schemes and understanding the hidden aspects of nuances it is for the best to present their classification. From the kindergarten or the first classes in school we are taught that there are three colors which are the “parents” of all the colors and don’t worry, this isn’t a story for the kids. The RGB system used on our computers is nothing more than the digital version of the old tale (a “small” technical replacement of yellow with blue). The “R” stands for red, “G” for green and “B” for blue.

Red, green, and yellow are called primary colors and all the colors from now are created by using various percentages of them.

Secondary colors are formed, as you probably guessed, from the primary ones: combining yellow and blue the green color is born, from the combination of blue and red appears purple and from red and yellow we have orange. The color wheel from below reveals to you the secondary colors better.

Finally, the tertiary colors are the result of combining the primary with secondary colors: yellow-orange called marigold, yellow-green is chartreuse, red-orange or vermilion, red-purple is magenta, blue-purple born the violet color, and blue-green is aquamarine. These mixtures are somehow hard to remember but using the visual concept from below learning can become easier.

• Using The Color Wheel
• Colour Mixing with Designers’ Gouache

Another classification divides colors in two main categories:

• Warm Colors:

  These are the ones situated on the color wheel between red and yellow.

• Cold Colors:

  cold colors are called the ones that are based between blue and green. They radiate calmness and it is a reason of their being frequently used for the creation backgrounds. The combination between a warm and cold color has as a final result the accentuation of the last one. (Keep this idea in mind, it’s very useful when powerful contrast is required).

A web designer must know that colors have special meanings, for the most of us the white is the color of purity or red is for love but are you sure that these work all around the world? Surprisingly, in various parts of the world, the meaning suffered alterations so it’s wise to study the meaning of colors. A multi-cultural project is a real challenge from the coloristic perspective; consequently, the next tips are helpful.

• White:

  Universally, the color of armistice;

  White is the color which represents purity and cleanliness and because of that the brides in European countries don white wedding dresses.

  In China and some African countries it is the color of mourning; it was also in Europe in the Middle Age but nowadays it’s totally outdated and I don’t advise to mark your mourning in white color. In China, white represents at the same time autumn, age, virginity and purity.

• Black:

  It has a lot of meanings, each situation pointing out to a new significance;

  The great Pierre August Renoir said: “For 40 years I’ve been discovering that the queen of all colors was black.”

  It represents the color of mourning in Europe but it is associated with sophistication, mystery and elegance.

  In China a black product means quality and trust while in Thailand it is bad luck or evil.

  It is great when you want to emphasize other colors (did you notice that many photography portfolios have a black background – it is used because the pictures are highlighted on a black colored screen).

  Used on a large scale, black may be depressing.

• Red:

  In European cultures it has three main senses: love and passion (Valentine’s Day is full of red hearts, all the gifts must contain something in red), danger (many traffic signs use red to warn the drivers and passers-by) and excitement (search for some online stores and study the call-to-action buttons, are they red?);

  In China red is associated with joy, good luck, in India with purity, in Japan with life.

  It influences the human metabolism, raises blood pressure; anyway it’s a strong color. Because of that, it is highly recommended to avoid the direct combinations with blue and green (it creates a powerful tension to the eyes).

• Blue:

  It is the most preferred color of people and the fame of “safe color” is correctly established (important tip: if you have to design a website for a financial institution, it is almost necessary to insert something blue);

  The worldwide meaning of blue: good fortune, calmness, wisdom, respect, devotion.

  In Iran blue has special meanings as mourning and immortality and in Columbia soap (I am not from Columbia, but too many online sources are agreeing with this; I will highly appreciate any clarification about this fact)

  The final thought about blue is the Van Gogh idea: “There is no blue without yellow and without orange.”

• Green:

  A trendy color quickly associated with the eco-friendly products and natural environment;

  Usually green is associated with: abundance, freshness, safety, and youth;

  In the USA it represents monetary power (dollars are predominant green, it’s obvious);

  Ireland is an entire country that is dedicated to green.

  The countries with a good density of jungles associate the green color to death.

• Yellow:

  Did you know that studying in a yellow room your test results are better? Do you know that a baby in the same “yellow conditions” has the tendency to cry more? Studies reveal that the yellow color stimulates the mental activity, attracts attention, and combined with black, ensures the most powerful contrast.

  Taxis and school busses are mostly painted in black and yellow, guess why? Could it be about the strong contrast that attracts the eyes of the people…?

  Europeans perceives the yellow as a source of happiness, joy and hope while the Asians have a more respectable approach to it and consider it a royal color.

Choosing the right colors can’t be achieved by reading this post and few others; this kind of expertise is gained across the time and the practice is the best teacher.

A real help in selecting a proper solution related to the colors used into a website are the online applications that allow an easy handling of these. More information and addresses where the best applications can be found are here and I really recommend using them on a daily basis to make the colors “your friend”.

Experts in web design have classified the color schemes; they noticed that each project looks fine by using certain colors and some aren’t impressive enough to be used. This classification isn’t a fixed one; you shouldn’t take it as an axiom but it is useful in the final selection of the colors used.

Monochromatic

As the name itself is saying, the designs based on a single color use a monochromatic color scheme; the differences in hue and saturation being the single differences that allow for a clear visualization. Here may the achromatic color scheme be added up, namely black and white works. A monochromatic color scheme lacks the high contrast but it has the advantage that the majority of websites aren’t using such a solution. If you must create an original and modern website, a monochromatic scheme is welcomed. The websites below have already applied this idea and the results are brilliant.

• Polargold.de
• Cellzone.co.uk
• Paralotna.pl
• Artofdyingmusic.com

Analogous

An analogous color scheme uses colors that are “neighbors” on the color wheel. The websites based on this color combination are easy to the eyes, not too much contrast, zero tension hence a powerful message can be sent but may be created amazing works.

Complementary

Definitely, here we can speak about powerful contrast; an intense message needs such a color scheme. The process of selecting a complementary color combination is simple: you select a nuance and on the color wheel choose the opposite of it. The imaginary line between your colors must divide the circle in two equal semicircles. There you should pay great attention to the selection, avoid any tension between colors else the visitors won’t be capable to enjoy your work; it isn’t easy to the eyes. Can you look at the image below more than 7 seconds? Surely, you can but the effort is pretty important.

Triadic

In this case, the web designer uses three colors which are situated each one under 120°. This is the equivalent of a very balanced layout, in the most cases only two colors are preponderate and the third one is used only to highlight.

Split Complementary

The split complementary color scheme requires more refinement from the designer, but this doesn’t mean that an amateur or a less experimented individual can’t work with it. You must select a color, find the opposite on the wheel and from there, to both the left and right you are allowed to move a few degrees and choose the colors. Below, you will find this selection more evidently explained.

• Basic color schemes

Tetrad

Tetradic implies the use of four colors: two adjacent and the opposite of these. Apparently, it’s complicated, but it’s useful when a colorful design is needed.

From my experience, I infer that for a newbie the theory of above seems difficult and hard to put in practice but in fact many of us judge colors without realizing it. Somehow, it’s similar to the process of walking: all of us know how to walk but describing the physical process is more complicated than we may expect. Is it true? Certainly, I have a lot to learn about colors but I am allowing myself to advise you: always try to decode what the designer wants to express by using some colors; repeating this process on a daily basis, colors won’t be a secret for you.

Why are Colors So Important?

01. Colors have manipulative powers

The great majority of people don’t pay attention to this but colors may influence us. Designers noticed that some colors or the combination of these make people react while others make them very calm. As I previously said, there are very few websites of financial institutes that don’t use blue. This color predisposes people to calmness and wise decisions and these attributes are quite necessary in this field.

The websites related to the environmental issues are all using green and sometimes brown; imagine a website representing a company acting in the domain but using black and red colors. Only a genius may handle these colors to create something qualitative and having something in common with the nature. Here the same manipulative principles are applied; the colors of a website must suggest the essence of it.

02. Colors may attract or run away visitors

A cool design, very functional, respecting the rules of web design may be easily destroyed by a poor color scheme. Due to the amazing number of possibilities, users prefer to make a superficial judgment and the colors contribute to a good first impression. In conclusion, the colors are a double side entity: these may be your friend, “calling” visitors to land on your page but adding together “enemy” nuances may scare people which will never come back to you.

03. These may emphasize your message

The contrast is very important in the context of a website, by using it the main message is highlighted and the readers understand what you really want to say. I think its purpose is too obvious and I wouldn’t treat the contrast but I warn anyone that the other extremity is dangerous: lots of contrasting elements don’t emphasize more or clearer the ideas, just make the website horrible and a disaster to the eyes. Many designers consider that complementary colors can realize a quality contrast that is very wrong; there is a big difference between contrast and tension. The tension is powerful and not easy to the eyes while the contrast just highlights something.

The false reason of a strong contrast is given by the accessibility principles which require a very clear difference between near colors in order to help people with various problems. A smart web designer knows how to overcome this issue: the huge majority of the people that face sight problems usually see all the colors in different nuances of black and white or all the images have plenty of gray. In conclusion, when you are in doubt about, is recommended to desaturate your files and study the visibility; once you have no problem and everything is clear go ahead, you got the OK from the accessibility point of view.

04. Colors are the soul of marketing

Apple is almost the biggest company in the world and they got this coveted position by offering quality products but it wasn’t enough, the strategy of marketing was brilliant. What we all should learn from them is that nowadays marketing isn’t an optional component, it’s vital to attempt to be a more and more well-known brand. A study realized by the University of Loyola has a shattering conclusion: colors increase brand recognition with more than 80%.

Did you see many black and white ads? I doubt that…but have you asked yourself why? The natural colors, besides boosting recognition, make people more active towards buying or asking for services. This statement is based on another study that reveals the appetite to participation of the people that receive subliminal or normal messages with the aim of colors. As a small extension, the colored ads are read up to 40% more than the correspondents in black and white format. In commerce, colors make the difference between a well-sold product and a decent one; studies demonstrate that 80% of the customers believe that a colorful wrapper is the mark of a better product.

We all must be aware that the surveys and studies are the objective proofs that demonstrate the colors must be our friends because bring us massive advantages. In commerce, it’s evident that by neglecting them, the incomes and the profit are neglected as well; I believe it’s the same in web design but in a more subtle way. What do you think? Do you give an important role to the colors used in your projects? Please let me know and share your interesting perspectives with the readers by using the comment form.

Image Credits

• Three Dimensional Color Wheel