Every year, designers have to develop more creative ideas for websites to stand out in the market.
Creativity boggles the mind and sometimes even negatively affects the user experience because people don’t understand where to click and what to expect from a website.
That’s why simple, sometimes brutal design stands out against complex experiments.
Let’s explore what to consider when creating a brutalism website and examine some great examples for inspiration. You can use these WordPress brutalist design ideas for your next project.
Table of Contents
- History of Brutalism Style Emergence
- The Main Features of Brutalist Web Design
- Benefits of Brutalism Website Design
- 8 Inspiring Brutalist Websites
- FAQ
- Final Words
History of Brutalism Style Emergence
It is traditionally believed that brutalism in web design came from architecture. In the 1950s, due to the lack of funds for the construction and decoration of buildings, most structures began to be built in the “raw form.” Sharp corners, lack of processing, and strict lines look simple, confident, ascetic, and monumental.
At the time, most countries were facing a housing shortage after World War II and needed a solution that would help build large numbers of buildings quickly and efficiently.
At that moment, brutalism was born, which was the complete opposite of the popular architectural styles.
The Main Features of Brutalist Web Design
Brutalist design defies the calibrated lines and colors of modern design. It can be flashy and bright or black and white. Here, functionality is more important than aesthetics. All elements and fonts look simple and sometimes even “unfinished.” However, on such a site, visitors can see exactly where to click to get the necessary information and what is expected of them.
In French, “brut” means raw; thus, “unfinished” comes. Here are some examples of what creates brutalism in web design:
- simple system fonts;
- underlined links;
- lack of processing of different elements;
- simple backgrounds with no gradients or parallax;
- simple navigation and open menus;
- tables of content;
- accentuated brutalist buttons.
Your brutalist website may contain all of these elements or some individual ones. Many designers prefer to combine brutalism with other styles, creating a unique cocktail.
The brutalist style was most often found on websites from the 1990s to the 2000s, and some that still work today retain this style.
Benefits of Brutalism Website Design
Here are a few critical benefits of simple brutalism-style websites:
- Ease of use. Website visitors quickly understand where to click to get the information they need, so the user experience and enjoyment of interacting with the site are improved.
- Fast loading. Typically, this kind of website loads quickly because no complex elements exist.
- Attention to content. Since visuals are less important on a brutalist website, you can put the most critical things in the most prominent place and not worry about forms. This is the main difference between brutalism websites and minimalist ones.
The minimalist style tries to use fewer elements but cares about aesthetics. On brutalism websites, aesthetics is not as important as the content. Some developers use only HTML with standard settings for such websites.
Yes, brutalism, with its raw fonts, bright colors, and simple structure, is not suitable for everyone. But it ideally helps to stand out in a market of equally aesthetic pages.
NOTE
If you’ve made a site on Elementor and are unsure if the chosen designs are suitable but want to know for sure, use services to track traffic. You can use the Elementor Custom code feature to add a tracking code.
8 Inspiring Brutalist Websites
Now, let’s look at some interesting examples of brutalist websites.
Balenciaga
This brand is fantastic in its fashion ventures, and its website keeps up with its whole concept. The company’s fashion designers combine materials and styles that no one has ever combined. The brutalism website design best displays this attitude toward fashion.
Here, you can see simple color and black-and-white photos without effects, simple navigation at the page’s beginning and end, and visible buttons.
Utrecht
With its white background and red font, this website lacks unnecessary elements. Everything serves to convey important information about the exhibitions. The blocks of the site are separated by a line, and at the top, you can see a menu with important links.
DAPP BOI
In this example, a designer creates a website to sell his services using cryptocurrency. The site has a black background and contrasting blue, and a massive font catches the eye at first glance. It has no complex elements—just the font, ticker above and below, and geometric shapes, which make it memorable.
Ray Charles Video Museum
The following interesting example of brutalism website design is dedicated to Ray Charles’s work. It contains his albums, clippings from posters, and other information collected by fans. The site is very simple: black font on a white background, clear navigation, and black-and-white photos of Ray.
Te Tuhi
A contemporary art gallery should have a website that reflects that art style. It is exactly what we see on this New Zealand gallery’s website. Catchy colors that do not match, large fonts, and violation of all the rules—this is what is reflected on the Te Tuhi website. At first glance, it is clear that a person has come to a site dedicated to art.
Foursets
Just look at this example site. Huge fonts play a key role here. Some elements are animated, but they are not so much to distract attention from the main thing. Simple geometric shapes and tables on a white background look very impressive.
UI Academy
This website presents web design training and incorporates brutalist elements as well. It has a white background, simple blue and black fonts, minimalistic elements, and maximum information. Even the team photos are in the same style and added in blue with minimal processing.
Dossier Industries
The final website in this article belongs to the publisher and differs from the previous ones. Here, you can also see a white background, dividing lines between the site’s blocks, and black font, but the navigation and the variant of the appearance of pictures on the screen are chosen completely differently.
FAQ
Use standard fonts, shapes, tables, and bold typography. Use large, bold text sparingly to draw attention to important content or headings. And remember that in this design, content is more important than layouts. Feel free to experiment with colors and text sizes.
It looks rough and may not be appropriate for some businesses or people, but this can be said about any other style.
No. These types of designs are similar in that they use minimal elements. The main difference is the approach to using whitespace on the website. Brutalist design tends to minimize whitespace, so avoid excessive padding or margins between elements. Also, minimalistic design strives for aesthetics with minimal elements, while for brutalism, aesthetics are not the main thing.
Final Words
I hope my selection has inspired you to create your next brutalism website design. Even using minimal elements, brutalism can be varied and exciting.
Most importantly, don’t be afraid to experiment.
