This is the second article of our series, Anatomy of Colors in Web Design. Over the next few months, we’ll be covering a spectrum of colors. And one color at a time, we will be featuring web design from around the world. If you missed the first of this series, you may want to catch up and read our article Green and Environmental Concept.
Today’s article will explore the use of the color Blue in Web design. Please remember to continue watching this space, as we take a closer look at other colors in upcoming months.
Subscribe to our RSS feed or Follow us on Twitter so that you won’t miss the full series.
Although it is often overlooked and often unappreciated, colors play a very big part in our life. There are infinite numbers of colors in the world. Sadly, not all colors can be seen by our naked eye. Color affects and influences everyone in their work, whether you are an artist, designer or engineer. The ability to mix and blend colors creates new possibilities in today’s already colorful world.
Today we discuss the color Blue and take a look at how it has benefited us.
Blue is the only color which maintains its own character in all its tones… it will always stay blue; whereas yellow is blackened in its shades, and fades away when lightened; red when darkened becomes brown, and diluted with white is no longer red, but another color – pink. — Raoul Dufy, French Fauvist Painter, 1877-1953
Definition of Blue
Blue is a color, the perception of which is evoked by light having a spectrum dominated by energy with a wavelength of roughly 440–490nm. It is considered one of the additive primary colors. On the HSV Color Wheel, the complement of blue is yellow; that is, a color corresponding to an equal mixture of red and green light. On a color wheel based on traditional color theory (RYB), the complementary color to blue is considered to be orange (based on the Munsell color wheel). The English language commonly uses “blue” to refer to any color from navy blue to cyan. The word itself is derived from the Old French word bleu.
Image credit: Wikimedia Commons
Why Choose Blue?
One of the most common colors chosen as their favourite is the color blue. It is favoured by both men and women of all ages. However, traditionally, men have a much stronger preference for blue than women. It may be the calming effect of the color that makes it popular to both sexes. However, it could also be the association of some shades of blue with authority figures, as well as the correlation we place between intelligence, and stability with the color blue.
Blue conveys a subtle connotation of importance and confidence, without being overly serious, sombre or sinister. As such, blue power suits are popular with important corporate players and the color most used for police uniforms. Blue’s long standing as a corporate color, especially darker shades of blue, is associated with intelligence, stability, unity, and conservatism.
Interestingly, some believe that blue slows a person’s metabolism rate and suppresses one’s appetite. As it does not require much effort of the eye to focus, images and objects recede in blue backgrounds. However, if overused, the color blue can create a sense of detachment and coldness. Although very popular with women as well, blue is the predominant favourite of males. As such the color blue is well suited to be used for web sites involving and promoting technology, medical products, cleanliness, air, sky, water, sea and automotives. Another interesting point is that Blue is the favourite color of more than half of the world’s population, and the least disliked color by most cultures.
The Benefit of Blue
Blue is an overwhelmingly “Popular Color”. The color of the sea and sky, blue is seen as trustworthy, dependable and committed. We are surrounded by the color blue, from the blue skies above to the deep blue of the oceans. As such, blue is a constant in our lives every day. The color blue also symbolizes qualities such as depth, stability, trust, loyalty, wisdom, confidence, intelligence, faith, truth, heaven, tranquillity, calmness, and sincerity. Despite blue being a color preferred by men, it is still the least “gender specific” color, with its equal appeal to both men and women.
Blue can be used across a large variety of websites. It is also one of the preferred colors for corporate designs, as such you’ll find it used quite often on big company websites. The communications and web industries use medium shades of blue because it can appear to be sleek and high-tech, especially when combined with shades of grey. In general, lighter shades of blue are often used to promote health and wellness, travel, and relaxation, while darker shades are often used by political and patriotic organisations, legal firms, and sports teams.
As a collective color, it invokes rest and can cause the body to produce chemicals that sooth and calm the senses; however not all blues are serene and sedate. Electric or brilliant blues are dynamic and dramatic, and engaging colors that express exhilaration. Save for such blue shades, in most cases, blue causes the opposite reaction as red.
Peaceful, tranquil, blue causes the body to produce calming chemicals, so it is often used in bedrooms. Blue can also be cold and depressing. Fashion consultants recommend wearing blue to job interviews because it symbolises loyalty. People are also said to be more productive in rooms with blue as its main color scheme. Interestingly, studies show weightlifters are able to handle heavier weights in blue gyms.
Different Type of Blue in Web Design
Let’s take a look at how different types of the color blue apply to Web design, and also when it is used alongside other colors.
Dark Blue
Dark blue is often used for websites that want to be seen as powerful and safe. It also symbolises knowledge, integrity, seriousness, masculinity, and expertise.
Light Blue
Light blue symbolizes health, healing, tranquillity, understanding, and softness.
Pale Blue
Pale blue gives an ethereal sense to the website and often symbolises delicate, calming, health, healing, tranquillity and understanding.
Royal Blue
Royal blue like its name gives a regal and superior feel to websites that use the color. It also symbolises richness and sometimes cool aloofness. Dark blue on the other hand often represents depth, expertise, stability, credibility (especially with gold), intellect, wisdom, corporate color, warmth, knowledge, power, integrity, seriousness, knowledge, health, decisiveness, law, order, logic, dependability and serenity.
Blue with Red, Orange or Yellow
High impact designs can be created with combinations of blue, red and yellow. Add in a dash of blue to cool down a hot red or orange scheme. The high contrast of putting blue and yellow together is sure to grab the attention of visitors.
Blue with Pastel Colors
In combination with shades of pink and pale yellow, the feeling of spring’s wonderful possibilities is created. Aqua, a tone of cyan, is another shade of blue. It gives one the feeling of freshness, pristine, vigour, movement, drama, confidence, strength, individualism, eccentricity, light heartedness, fearlessness and festivity.
Blue with Green
When you use both the colors blue and green, one gets a sense of natural peace and tranquillity. Its gentle and soothing earthly palette gives you the feeling of being transported to a green meadow under a vast blue sky with nearby waterfalls to calm your fears.
Blue with Light Brown, Tan, or Beige
Sky blue and Robin egg blue (also known as eggshell blue) when combined with neutral light brown, tan, or beige is an environmentally friendly color combination.
Blue with White
Dark blue with white creates a fresh, crisp, and nautical feel to the website. And the color combination of red, white, and blue is a patriotic color scheme for many countries, including the United States.
Blue with Metallic Silver or Grey
The use of dark blue with metallic silver accents provides an elegant and rich appearance. If you prefer an understated elegance, try using grey instead.
Showcase of Blue Identities
Here are some of the corporate websites that have made use of the color blue either on its own or by combining darker and lighter shades of blue and other colors to create a conservative and sophisticated look. Combinations of light and dark blue can invoke visitors’ trust in the product or company.
Showcase of Freelancers
Blue have been used sparingly in the portfolio of these freelancers. These sites are an excellent showcase of how blue can attract the attention of visitors.
Ana Penović and Boris Ličina Borja
Showcase of Blue Web Design
These are some examples of websites that have used a variation of the color blue in their designs.
More Resources
- Colorcombos: The Combo Library contains pages of blue color combinations (a.k.a, color schemes and color palettes) for you to choose from.
- Colourlovers: They have many blue color palettes that can inspire you for your creative projects.
- Blue Web Color Palettes: An article that talks about color palettes that feature different shades of blue.
- Six Revision: Take a look at their showcase of 30 Beautifully Blue Web Designs.
- The Design Inspiration : Take a look at their showcase of 55 Stunning Blue Logos, Websites and Patterns Inspiration.
- The Design Mag: Another good showcase of 48 Creative Websites Designed in Blue.
- Background Labs: They offer a wide variety of blue backgrounds for various uses.
The Many Facets of Blue
Blue can be a representation of many things to different people. However, it is something you need to be aware of when using it in your design. Who is your target audience and how will they react to the color blue on a web site, a logo or a poster?
What do you think of the color Blue? Share with us your thoughts!
