Pattern: Design Principle No. 5

Look at your outfit. Chances are you’re wearing some sort of pattern right now. Am I right?

In web design, pattern creates consistency through the repetition of certain elements. Today I’m continuing the series, Applying the 7 Principles of Design to WordPress, by sharing some examples of WordPress websites that are using pattern in an inspiring way.

Example: Traveling Vineyard


Traveling Vineyard uses the repetition of circles throughout the site (logo, hero, icons, key, reviews, background, social media icons and loading graphic) to achieve consistency in the overall user experience.

Example: The New Yorker


The New Yorker website incorporates elements from the iconic, printed publication (typefaces, illustration, layout) and brings these patterns to life online.

Tips to create pattern

  • Capture the essence of the logo and brand in the visual elements used in the design
  • For example, if a logo has circles, use circles throughout the site—icons, patterns, graphics
  • Look at existing print collateral to create a complementary design

Know any sites that are using pattern in a way you like? Please post ’em in the comments. Next up—Design Principle No. 6: Rhythm.

About Jill Anderson

Hi, I’m Jill, a WordPress WordPress designer/developer who partners with talented designers, copywriters, and agencies on their websites, and their client’s sites. I’m passionate about crafting beautiful and innovative WordPress websites focused on clear positioning and positive user experiences. Get my free report, Get Your Website Done: 12 Actionable Steps for Designers, and check out my Client Onboarding Toolkit, a simple 4-step digital course for converting prospects into a paying clients.


Like this? Get new posts via email.

No spam, no worries. Just my bimonthly(ish) blog posts straight to your inbox.

Leave a Reply

Your email address will not be published. Required fields are marked *