Brutalism brings attention to material, structure and construction. Architectural Brutalism provides historical context; graphic and web uses reinterpret aspects of directness or exposed structure and have their own conventions and usability concerns.
Oversized INDEX lettering and a concrete building image share a stark red, black and white layout.
A concrete stair photograph sits beside a narrow white column with an archive label and blue link.
Pink SHIFT lettering anchors a dark composition of a running figure, a wireframe tube and technical panels.
Large purple LOOK lettering sits beside a halftone face and small geometric diagrams.
ABOUT THIS STYLE
Type
Design approach
Categories
Experimental
Disciplines
Graphic Design
UI Design
Period
Architectural New Brutalism developed in the 1950s; contemporary web uses borrow the term in a different context.
Label status
established term
Origins and attribution
RIBA describes architectural Brutalism through materials, texture and construction, including exposed brick and steel as well as concrete. Web practitioners later borrowed the name: Pascal Deville’s gallery and David Bryant Copeland’s principles emphasize different approaches. NN/g distinguishes web Brutalism from Anti-design. This entry connects these contexts without treating them as one historical movement.
Research source
brutalistwebsites.com · brutalist-web.design · nngroup.com · smashingmagazine.com · creativebloq.com · riba.org
Images generated by
GPT-6 Extra High
RELATED STYLES
INGREDIENTS
Architecture: emphatic mass, texture and visible construction. Graphic interpretations: bold blocks and direct hierarchy. Web applications: conspicuous structure, plain controls or deliberately raw presentation; these are selected approaches, not shared requirements.
POSSIBLE APPLICATIONS
Graphic studies, cultural identities, architectural image studies and websites whose visible organization supports the content.
WAYS TO EXPLORE
Compare a documented building, a graphic interpretation and a working website. Explain what is being borrowed in each. Test readable type, visible links, focus and navigation in the interface; visual roughness does not justify inaccessible controls.
OFTEN CONFUSED WITH
Often confused with Neubrutalism, Anti-design and Scientific brutalism: this entry connects architectural context with graphic and web applications; Neubrutalism describes a contemporary interface treatment, Anti-design challenges conventions, and Scientific brutalism is a working technical-document direction.
SOURCES
nngroup.com — brutalism antidesign
smashingmagazine.com — split personality brutalist web development
creativebloq.com — are brutalist sites the webs punk rock moment
Visual examples are original AI-generated studies.