Color Combination for Websites – The Do & The Don’ts of Colors

Did you know that visual elements and color activate or spark the right side of the brain (emotions), when on the other hand printed words trigger the left side of the brain (logic)? Typography and Color continue to be very important elements in web design. When you pleasantly coalesce them all you draw a more rapidly attention to the topic, emphasize impact and acknowledgment, assist in establishing influential identities and brand, while setting the mood.

Today we’ll look at those Dos & DON’Ts in web designing in regards to color.

Children are color dominant: They are more influenced by color than they are towards form. Even as we mature and become a lot more form dominant, color will always still be an important part of how we perceive the content or the message. For example, why are we always putting our attention when Red calls? Regardless if you want to play or manipulate the colors of your website or your web design, maybe an advertisement that will attract viewers to your services and products. The essentials of color should help you to being more wise with color usage.



Take the time to educate yourself with the color wheel. Every color is made up of just 3 primary ones that include: yellow, red and blue. When the primary colors are mixed you will get secondary colors which make up: green orange and purple. Then when you mix up those colors with the neighboring primary, you will now have 6 tertiary colors which make up: orange-red, purple-red, purple-blue, blue-green, yellow-green and yellow-orange. That is how you will remember the 12 color wheel.

There is a temperature for each color  the yellow/red side would be the “warm” then from the purple/blue side it’s “cool”. There is an intensity that is described as chroma or saturation. Saturation is how much or little of grey contains in a color  High intensity colors are bright, pure and vivid. When colors are less saturated they are muted, subdued and soft. All colors have value which is determined by its darkness or lightness. When you’re planning a combination of color, saturation and value are just as much important as hue.

DON’T miss on understanding the basic color wheel rules:

The majority of colors look amazing when they are combined with shades in a variety of intensities or values which are known as Monochromatic containing colors that are drawn within the same hue.

Colors like to also spend time with their neighbors. Any of the 3 neighboring colors from the 12-color wheel makes up the Analogous scheme of colors  They are always pleasant because they are in sync or share rather the same undertones. Yellow-orange, yellow and yellow-green. To put more force to the group of Analogous, you can broaden it with another next door neighbor such as orange.

Opposites attracts, even with colors, and that’s how you get Complementary colors: they are the opposite hues on the color wheel, that “complete” each other when used as a pair. Warm colors have cool complements and vice versa.

DO examine the color undertones.

If you like the color blue but would like to have the subtle effect, choose grey or white with the undertone being blue. Just don’t do too much emphasizing on the undesired undertone if pairing with the complement: If the brown shade has an undertone of pink to it, having a green combination (red being the complement) will only increase the problem.

Its good to if you can identify the tone of color  its coolness or warmth. Learn it. A warmer color blue consist of some red making it look too purple. While blue being cool consist of a bit of green making it look teal or aqua. Remember also,  neutrals also consists of undertones.

DON’T overlook the fact that colors also ‘change’ according to its surrounding:

A Big rectangle and a thin line that are of the same color will look like different values if placed next to a white background: The line’s color will appear darker than it would in the rectangle, because it’s bounded by a larger amount of brighter white space.

DO learn Color Psychology

While the perception of color tends to be quite subjective, and do have dissimilar meanings in a variety of cultures, some colors influence us in a comparable way. Our human eyes would see warm colours before it sees cool hues. Colors that are cool appear to move away, while colors that are warm show to advance, but the level of saturation could make a difference.

RED: With its forceful, exciting and seductive nature, forceful attention and action, the color red is impossible to disregard.

PINK: It depends on its value or saturation, pink induces various mood swings. Fuchsia and magenta are perceived as theatrical and sensual. But if the red in the lighter pinks is water-downed, the sensuality of the red is replaced with kind romanticism.

ORANGE: Having some drama of the red, the orange is tempered by the welcoming humor of the color yellow.

YELLOW: Black with yellow would be the most un-ignorable color combo in nature – stinging bees and tigers, – it’s the kind of color that speaks and says: You better be looking at me!

BROWN: Durable, rustic, deliciously rich and wholesome are just a few traits of that color that is usually associated with home and earth, stability and substance.

BLUE: If you have noticed plenty of financial institutions and corporations use blue for branding? Reason being is blue is perceived as committed and dependable. Its also used as serenity and calmness. If the blue is darken it’s an instant authority, power and credibility.

GREEN: Associated with foliage and nature, green in web design can be used as neutral color: green colors don’t clash with pink roses or red, lilacs, yellow sunflowers or bluebells.

PURPLE: Probably the most complexed and enigmatic color. With meanings – from spiritual to mysterious to royal and elegant.

WHITE: Obviously white says purity, sense of simplicity and clarity. White is a bright color by the human eye, that’s the reason it works great with contrast and all colors.

BLACK: is considered dramatic, powerful, heavy and a classic color with a sleek, up-scale look. Because of it being an extreme contrast to white, black and white is the typical combination of clarity and depth, innocence and power.

DON’T be afraid to be experimental with combining colors. Sometimes even the prohibited combination of colors works.

DO study other websites and web designs to decide which color schemes are better attractive than others.

DON’T overlook about the readability when color combining


News & Latest Posts

Our Address & Contact

Company Web Design

7111 Syntex Drive, 3rd Floor
Mississauga, Ontario L5N 8C3