In this month’s design tutorial we continue to explore the principles of graphic design. Last month I introduced you to the theories of hierarchy and emphasis and this month we explore contrast, which goes hand-in-hand with these theories. Contrast is often a principle that is easily forgotten; however, as you will see, if used effectively it can play an integral part of any successful design.
What is Contrast
The simple concept behind contrast is to ensure that every element within a design does not look the same. In essence you should have a number of elements that look vastly different to the others within a design.
For example, if you had a page that contained ten squares of which each were evenly spaced apart, and all the same size and colour, there would be no contrast. However, replacing one of the squares with a circle would instantly add contrast and in addition make a focal point.
Contrast can refer to colour, shape, texture, size and typeface and is necessary to ensure a design does not look boring or one dimensional.
Ways to Achieve Contrast
- Ensure that all the shapes on the page are not the same kind. Images, graphics and paragraphs all create shapes, so consider using varying forms, not just squares and rectangles.
- When choosing typefaces and if using more than one kind ensure that they vary significantly. For example, don’t choose two Sans-Serf fonts. Instead choose a Sans-Serif and a Serif or a Sans-Serif and a Script.
- The sizing of elements is important. Something small sat next to something big will create contrast.
- When selecting colours, relationships such as complement, split complement and triad will generate the most contrast.
- Adding varying textures to a design can add contrast.
Below are some examples of how contrast has been applied to every day design.
The Informal Anymade Cafe
Black on white or vis-versa creates the most contrast when referring to colour. Shape is also used well in this design to create contrast. The shape of the circular coaster is in contrast to the rectangular form of the text and graphic.
In this example, both colour and shape have been used to create contrast. The dark blue and black on yellow is a high contrast palette. Also, the circular shape behind the model’s head is in contrast to the magazine shape and the other rectangular forms on the page.
F L E U R
This example showcases how texture can be used to create contrast. The boxes, lines and typeface are very clean and linear which contrasts to the organic nature of the illustrations.
Enchantment Under the Sea Dance
While the colour palette is very high contrast, it’s the typeface selection I wish to highlight in this example. Notice how the word ‘enchantment’ uses a vastly different styled typeface compared to the others on the page? As a result, this important word is not ‘lost’ within the design.
Where to Learn More
If you are looking to learn more about design I can highly recommend the book Graphic Design: The New Basics by Ellen Lupton.
And that wraps up this month’s design article on contrast. I hope you enjoyed.
Check out the other posts in this series:
The Principles of Graphic Design: How to Use Proximity Effectively
The Principles of Graphic Design: How to Use Repetition Effectively
The Principles of Graphic Design: How to Use Balance Effectively
The Principles of Graphic Design: How to use Hierarchy and Emphasis Effectively