Contrast is an essential principle of art and design work. To start with it can be tricky to get your head around what this term means, exactly why you need to be aware of it and how to introduce contrast into your own creative work.
In this blog post we will take a close look at the topic so you feel confident both in recognising contrast in others design work and using in within your own.
What the term Contrast means in a design context:
When thinking about contrast in Graphic Design your first thought is probably going to be of colour i.e warm vs. cool and dark vs. light colours. This is certainly an important area, as you can see from the image I decided to include above.
However contrast can be introduced in many ways. Used properly it attracts the eye, adds visual interest to a composition and creates a sense of depth to the work.
The designs shown in the images above are examples of contrast in: the size of elements, typefaces used, colours used and even the way the text has been placed/handled. You can see that when used well contrast is invisible to most people. The composition simply appears to be a pleasing design.
Imagine if everything in a composition was the same size and shape and colour, would be pretty dull right? And that's exactly why this design principle is so essential to good design work!
Not enough contrast and nothing will stand out, there will be no rhythm hierarchy and the art work/composition/ image definitely won't grab attention.
So although colour is an extremely essential principle of contrast, there’s also contrast of type, alignment and size.
But don’t go to crazy, like most things using to much contrast can ruin a piece of design work and make it look visually confusing. This will mean a viewer has no idea what information to look at first.
Using contrast is about trial and error, the more you design the easier it is to see when your work needs more or less contrast.
It’s also useful to look at others design compositions, you will find it becomes second nature pretty quickly!
Different way's of
introducing visual contrast...
Let's take a look at the different
visual devices you can use to create
a sense of contrast into your work!
Contrast in size
Making sure there is a difference in the size of your objects is one way of introducing contrast into your work. Contrast in size is useful because:
- Eyes are drawn to the larger elements
- Indicates the larger element is more significant
- Also add’s visual interest and can help introduce rhythm
- Helps establish a hierarchy!
Introducing contrast through the size of your assets can be applied to any design composition with more than one element (which I think is pretty much all design work.)
Poster collection by Quim Marin. Here contrast in size or scale is used both practically so the audience know to read the text in the upper left which bring context to the design and also creatively as seeing the characters in the bottom of the design so out of proportion make them into a feature of the design. A theme which is repeated throughout the set.
Contrast in colour
Colour is extremely diverse and there's loads of great contrasting combinations you can use. Here's some important pointers on creating a sense of contrast with colour:
- The maximum contrast you can achieve is between Black and White.
- You don’t want colour pairings to feel uncomfortable or difficult to look at. This can happen if two colour are two bright or even to similar. Looking at them can literally make peoples eyes hurt.
- Think about the tints and shades you are using! Don’t pair two extremely vibrant colours, it will be hard to understand.
- To start with keep it simple and pairs colours which are directly opposite each other on the colour wheel. These compliment each other and still have perfect contrast.
Branding project for Ruchki & Nozhki, who provide manicure and pedicure services. Here the colours are dramatically contrasting but still muted meaning they pair well together. If both were extremely vibrant the pallet may not work. Using these colours ensures important information like text or a logo always stands out!
Using contrasting shapes
There are many different shapes using a combination of different shapes in your design naturally introduces contrast but careful not to go to crazy! To many shapes will leave your design looking cluttered and unprofessional. Here's some more pointers:
- Similar to size using shape can help to draw the viewers attention to the right element.
- So you have lots of geometric shapes, introducing one organic shape will immediately make it stand out.
- This can be particularly helpful in poster and editorial design, where you are working with lots of images and frames.
- Shape can give also give an asset character, an interesting shape among boring shapes. That's already a strong visual message.
Packaging design for The Bijou Factory. Here a geometric shape (rectangle) is used to contain information and placed over the organic shapes. This provides contrast between the background packing design and foreground information for the viewer.
Visual identity for Skapa drömmar (design residency arranged and held by Art Inside Out.) Here there is a mixture of shapes, which were actually based on real life objects that were used to create a dynamic and familiar visual identity. In this case a contrast in shape is essential to the success and concept of the design.
Contrast in font choices
It sounds weird but using different Typefaces is a clever and subtle yet effective way to introduce contrast. Plus when working with a lot of text you will need to introduce some contrast to create a sense of hierarchy!
Here's some more info:
- Think about adding contrast with type when you are working with a lot of copy i.e Editorial or Web Design projects.
- Each Typeface has an individual style and personality, by introducing multiple styles it adds meaning and depth to the piece of work.
- As a general rule of thumb you don’t want to use exactly the same font throughout your design. Nothing will stand out and it may appear to plain.
- Using multiple weights within a font family is also a great idea as it ensures consistency but you can introduce a hierarchy of information and break up the design.
- It's easy to fall into the trap of using to many different styles! Typically more than 2 or 3 is not necessary anymore and you will end up with opposite problem, your design will be overly complex and might even look silly!
Label design for Malmgård brewery. In this example the contrast in typefaces not only helps separate information and create a sense of hierarchy it also helps communicate information about the product and brand itself. The traditional Serif typeface is a nod to the heritage of the brand, while the cursive hand script suggests the product is crafted, personal and cared for.
Hopefully this post helped define what the term Contrast means, why it is important and how you could go about using it in your creative work. This is one of the key theories to master in Graphic Design and once you have the hang of ensuring there is the right balance of contrast in your work will come totally naturally in your future creative projects.