Contrast is often the magical key ingredient to making your designs ‘pop’, which is a (sometimes frustrating) demand from many design clients.
In a very basic definition, contrast is the degree of difference between two elements of your design.
Some common forms of contrast are dark vs. light, thick vs. thin, large vs. small, etc.
Contrast has a great effect on readability and legibility as well, it’s a big reason why you see novels and many other publications printing in black text on a white background. Imagine if they printed using light grey on a white background. The contrast would be very low and the type hard to read. So, if you’re using type, make sure you bump up that contrast.
For example, check out this poster by Jonathan Correira and the way it ensures there’s adequate contrast against the type and image. Since this image is split in half, one side being dominantly green and the other dark grey, the type colour has been adjusted accordingly to ensure each side is legible.
Imagine if the “New York” was executed in the same colour as “Bike Expo”, the contrast would be lowered greatly and it would be much harder to read.
Another great example of a high-contrast design is this piece by Robbie Cobb that not only contrasts dark and light, but also thick and thin to make for a striking and engaging design.
Contrast isn’t just a stylistic element or a legibility-enhancer, it can also act to draw the eye to certain elements of your design. This technique is used a lot in website design, let’s look at an example from Audible’s landing page.
See how this landing page design has darkened and muted the image to allow for the bright red box to contrast sharply against the background. This deliberate contrast helps to draw instant attention to the main call of action (which links directly to a signup page).
So, use contrast to make your designs visually ‘pop’, draw attention to certain elements of your design.