2020 Website Design Trends: Geometric Shapes/Patterns, Grids and Frames, and Typography

Published: Tuesday, July 7, 2020 | Tags: Associations, nonprofit, Website Design

In our latest blog series, we’re sharing the Top Website Design Trends of 2020. We know that nonprofits, associations, and real estate associations work hard to continuously keep and attract new members. Your website should be a resource that helps your organization grow. One way to improve member engagement is with a great online experience. We hope that these website design trends inspire you and offer some new ideas of elements that can be used on your nonprofit’s site. 

So without further ado, here are examples of website design trends that implement geometric shapes, 3D, patterns, grids, frames, and typography.

Geometric Shapes, 3D and Patterns

Geometric shapes are a simple yet powerful asset that can make your website more appealing through the use of visual compositions. They can also be used to create visual dividers between sections.


Geometric Shapes

Immersive 3D Patterns 

Shapes and Patterns

Grids and Frames

Most websites are designed on an invisible grid system that helps keep items on the page organized and in-line. Grids with different sized “cells” give it dimension and visual interest.

Grids and Frames serve in delivering a message plainly and efficiently, making sure that the most important information not only comes across but truly registers - and resonates - with site visitors. In 2020, we are seeing these grids becoming more visually dominant and used as the primary design aesthetic, clearly inspired by the popular “card” design trend. 

Exposed Grids and Windows

The grid and its guidelines, both design conventions that are usually reserved for behind-the-scenes work, are now exposed, as web designers highlight the segmentation of the screen and its building blocks.

Shapes reminiscent of pop-ups or browser windows are now a seamless part of the page itself. This look can be nuanced, gently hinting at the familiar form, or more explicit with designs that wittily reference the early days of computers.

Grids and Oversized Type

To communicate clearly and instantaneously, websites are favoring large, prominent elements. Enlarged elements are eye-catching, and help site visitors understand what the site’s all about right off the bat. Not to mention, they look great on any screen size. 

Layers that Overlap

Overlapping layers and elements add a sense of depth and dimension to website design. You can overlap boxes and backgrounds, images or video, text, or user interface elements, and icons. 

Split Screen Content

Split screens give you the ability to convey more than one idea, but retain an uncluttered look.


Typography is the art and technique of arranging type to make written language legible, readable and appealing when displayed. The arrangement of type involves selecting typefaces, point sizes, line lengths, line-spacing (leading), and letter-spacing (tracking), and adjusting the space between pairs of letters.

Massive Font Changes

From an aesthetic point of view, bold fonts also give designs a modern and contemporary feel.

Text-Only Hero Images

Bold Fonts

If you visit websites of industry leaders, you might notice that the headline, not imagery, is being designed with large bold fonts. Heavy fonts put more visual weight to the message and direct the reader to where they should look first.

Combining Typography with Vintage Colors

Websites today are using vintage colors and/or typography as a way to convey this feeling of nostalgia. Font paired with the background color feels vintage, but not dated.


Keep a lookout for our post next week, 2020 Website Design Trends: Illustrations, Photography with Graphics and Videos/Animations. If you’re looking to redesign your website or have questions about incorporating any of these design trends onto your site, reach out to us and someone from our team will get in contact with you.

Contact Accrisoft Today


Struggling to grow membership?
Are you looking to increase revenue?
Need an easy to update website?

You can grow with Freedom Software.

Schedule a 15 minutes chat to discuss how Accrisoft fits within your organization.

Schedule a Call

Back to top