Principle of Contrast in Graphic Design: Learn How Fonts, Color & Images Can Create Interest and Contrast in Your Designs

Principle of Contrast in Graphic Design: Learn How Fonts, Color & Images Can Create Interest and Contrast in Your Designs
Page content

Understanding Contrast

The principle of contrast in design is important. It attracts the eyes and creates organization among page elements. Contrast also saves your designs from becoming dull and unimaginative.

Imagine reading a book without the help of page numbers, paragraphs or chapter headings. You’d find it difficult to make sense of the information. Information becomes one big blur when nothing stands out. Contrast works the same way. It provides order, and assigns significance to page elements.

Make it Work

Contrast gone wrong causes conflict. Conflict occurs when page elements are too similar to make a difference. Slight differences look like mistakes. For contrast to work, you must make bold statements. Take a headline and a subhead for example. A 36-point headline and a 24-point subhead provide contrast. You see that the two elements are different on purpose. A 30-point headline and a 29-point subhead are too similar. Readers will think you made a mistake.

Methods

Type

Mixing large type with small type is a popular way to create contrast. Publications do this with headlines and subheads. Headlines are large because they are important, and must stand apart from the rest of the page. Subheads are small, but break up the paragraphs. Imagine how bland the page would look without these distinctions. Using this method makes it easy to organize information in order of importance.

Image Credit: Michelle Strait

Different fonts also create contrast. Designers have access to hundreds of fonts. Create contrast by using different styles, colors and sizes. Pair a sans-serif font with a serif-font. Use black text for paragraphs and purple text for pull-quotes. Create vertical sidebars to break up long lines of horizontal text. You can design an interesting page just by using the type methods from this section.

Graphics

Graphics are an effective way to display contrast. Important images should appear larger than less important images. Consider an article about the benefits of fruit. The article states that all fruits are good, but that cranberries have additional benefits. In the article, you include pictures of several fruits including cranberries. To create contrast, the cranberries photo should appear larger than the other photos. Readers receive a visual cue that the cranberries are more important to the story.

Lines and spacing creates contrast as well. Separate items on a list by using consistent spacing between items. Emphasize items on the list by enclosing them in shaded boxes. Another option is to underline the list title with a thick line and use hairlines to separate list items.

Improve Your Designs

Use the principle of contrast in design to communicate your ideas. Type and graphic elements help your designs stand out. The next time you’re creating a piece, deliberately use contrast to see what a difference it makes. The results will surprise you.