Stylogenyin the style of Neo-Brutalism

Digital native · 2020–present · Global / networked, North America

Neo-Brutalism

Also known as Neubrutalism, Neobrutalism

A friendly, commercial descendant of web brutalism that keeps its blunt boxes but adds candy colour: thick black outlines, hard unblurred offset shadows, flat saturated fills and chunky sans-serif type on conventional, usable layouts. Popularised by Gumroad's 2021 rebrand and named 'neubrutalism' around 2022, it spread across startup, creator-economy and indie product sites.

Make something in this styleGet advice in this styleMix it with another style

A sample layout drawn from the style’s design choices, until its AI image is made.

01

How it works

  • Outline every card, button and input with a thick (2–5px) solid near-black border.
  • Drop a hard, zero-blur shadow a few pixels down and right; shift the element into it on press so buttons feel physically clickable.
  • Fill blocks with flat, saturated colours such as pink, yellow, mint and lilac on white or cream, never gradients.
  • Set big, heavy grotesque or geometric sans headlines, with a monospace for labels and metadata.
  • Keep the underlying layout conventional and usable, letting the raw styling supply the attitude.
  • Break the box grid sparingly with tilted stickers, badges and starbursts.

Startup, creator-economy and indie product websites, spread through Dribbble and UX Collective

02

Its design choices

From Stylogeny’s vocabulary of design choices: defining choices make the style, characteristic ones are usual, occasional ones turn up now and then.

Layout & composition
Space & hierarchy
Typography
Colour
Form & shape
Surface & texture
Ornament
Imagery
Medium & production
Tone & intent
Avoids
Gradients, Frosted glass, Soft extrusion, Gloss & highlights, Chrome & 3D render, Luxurious & glamorous, Calm & contemplative

Palette

  • #fffdf5
  • #000000
  • #ff90e8
  • #ffc900
  • #23a094
  • #90a8ed

Typefaces

  • Space Grotesk

  • Archivo Black

  • Space Mono

  • Lexend

Known for

  • Gumroad rebrand

    2021

  • neobrutalism.dev component library

  • 'Neubrutalism is taking over the web', UX Collective

    2022

03

Make something in this style

Say what you need, and Stylogeny’s image studio draws it from Neo-Brutalism’s design choices and checks it against them. It takes about a minute, and you get a link to share.

Rule out a choice, read the prompt, or blend in another style: take this brief to Mix styles.

04

Where it comes from, and what it’s close to

Before it

The style it grew out of, and the styles it borrowed from.

This styleNeo-Brutalism2020–present · Global / networked, North America

After it

The styles that grew out of it.

No later style in the atlas grew out of it yet.

Alike in its design choices

Styles that make many of the same choices, related or not, besides those above.

05

Real works

Artefacts in museums, libraries and archives that show the style, linked at their source.

06

Sources

  1. 'Neubrutalism is taking over the web', UX Collective (uxdesign.cc, March 2022)
  2. neobrutalism.dev documentation (neobrutalism.dev)

How Stylogeny researches and checks a style: where the facts come from.