Anatomy of Colors in Web Design: Attention Grabbing Red
Colors in web design do more than just offer a presentation, they can and often do speak for the product or service, not with words, but with moods and feelings. We have previously covered the anatomy of green, blue, yellow and black, so today we are taking a look at red in web design.
As children we tend to favor the color red, and we prefer bright shades of red such as true red and scarlet. The reason for this is that from a very young age, red grabs our attention. As we mature, it is thought that our blossoming personalities dictate which color we favor, and if we become extroverts we are very likely to continue to favor bright red shades.
Definition of Red
Red is the color next to orange at the end of the visible spectrum of light. Red is commonly associated with danger, sacrifice, passion, fire, beauty, blood and anger, and in many cultures it is related to happiness.
Red is visible when light has a wavelength between 620 and 740 nanometers. Light just past this range is called infrared and cannot be seen by human eyes, although it can be sensed as heat.
In traditional color theory, red is one of the three primary colors, along with blue and yellow. In modern color theory (the RGB color model), red, green and blue are additive primary colors. True red has an RGB value of 255, 0, 0 and a hex value of #FF0000. This shade of red is not possible to achieve in CMYK, but the closest value is 0, 99, 100, 0.
The Benefits of Red
Red is probably the most powerful color for expressing moods and feelings in all types of media. It is also the greatest attention-grabbing color in it's brightest shades. Red evokes strong emotions and encourages appetite.
Pales shades of red, ie, pink, give a very feminine and soft feel, while very deep shades of red such as crimson can express warmth and comfort as well as much more sinister emotions.
Red in mid shades can portray happiness and freedom, but of course, also blood, fury and passion.
It is difficult to associate any one meaning, mood or feeling with any particular shade of red, making it one of the most versatile colors of the spectrum, as well as the one color that has to be used in the correct shade for the message being sent to be perceived correctly.
Different Types of Red in Web Design
As previously mentioned, red can convey many moods, feelings and emotions. This is also true in web design, and the flexibility of red in its various shades gives it a lot to recommend it. Red is not commonly used as a main color in web design, but often serves as a complementary color in specific areas and many designers steer clear of red as a main color because of its diverse associations.
Hot or dark pink is a very warm color and is associated with heat. This can be literal heat as in summer, or figurative heat as in sexy/attractive.
Pink is a soft and feminine color offering a certain feeling of comfort.
Bright red shades are attention-grabbing, up-to-the minute colors. When used in combination together they can give a very clean appearance of professionalism and modernity.
Dark red evokes feelings of warmth, coziness and reliability. A welcoming feeling can be achieved with the use of dark red – after all, most theaters have dark red seats and a dark red stage curtain.
Pink and Black
Used in combination, pink and black suggest femininity with professionalism.
Red and Blue
Red and blue together give a vibrant and 'happening' feeling.
Red, White and Black
This color combination evokes a lot of moods and feelings, there is minimalism from the white, attention-seeking from the red and seriousness from the black. Together they produce a clean, clear result.
Red with Other Colors
When red is used amongst other colors, it will usually still stand out as the most prominent color, therefore, if using red in a color combination, it should contain a call-to-action or some very important content – it will often be the first thing viewers look at.
Using Red to Grab Attention
Red is probably the most attention-grabbing color in website design. Here are some sites that use red elements in their design to get the viewer's attention.
Showcase of Red Identities
Here are some companies and corporations that use red in any shade as the base color for their website designs.
Showcase of Freelancers
These freelancers have used red as the main color in their portfolio or website designs.
Showcase of Red in Web Design
The following websites have used red as the predominant color. Notice how the different shades of red evoke different perceptions about the site, product or service.
Further Reading and More Resources
- Colourlovers - Here you will find many palettes that include red.
- Red Web Color Palettes - A selection of color palettes that use web-safe colors.
- Red Websites - Examples of designs with the color red.
- 50 Red Web Designs to Inspire You - A large showcase of red website design.
- Color Combos - Red color schemes, palettes and combinations.
The Versatility of Red
There is no doubt that red is a very versatile color in all media, including web design. It has to rank among the bravest of color choices for designers as the correct portrayal of a message requires the correct shade of red.
Red can be one of the happiest, most vibrant or most passionate colors, but conversely, it can be one of the saddest, most aggressive and most sinister colors.
It is its very versatility that persuades a lot of designers to stay well away from the color red!
What do you think of the color red? Is it your favorite color? How would you handle red in your web design? Share with us your thoughts.