Stylogeny combining DTC 'Blanding' × Neo-Brutalism

Try

Style combination · Contrasts

DTC 'Blanding' × Neo-Brutalism

The post-blanding swing: thick outlines, clashing brights and hard shadows are the quickest way out of pastel sameness.

From the research on DTC 'Blanding' / Millennial Minimalism

Mix them and make something DTC 'Blanding' Neo-Brutalism

wowwowDTC 'Blanding' × Neo-Brutalism2012 · 2020
A sample layout drawn from the recipe: shapes from Neo-Brutalism, their arrangement from DTC 'Blanding', the finish from Neo-Brutalism. Not a real work, and not an image of either style.

01

What each style brings

Each part of the design comes from the style with the stronger say in it, and each style gives at least two.

DTC 'Blanding' / Millennial Minimalism Neo-Brutalism

Type from DTC 'Blanding'
Colour from DTC 'Blanding'
Form from Neo-Brutalism
Composition from DTC 'Blanding'
Surface from Neo-Brutalism

02

The type

Open fonts standing in for each style’s own type, which is often hand-drawn or commercial.

Display · DTC 'Blanding'

Wow

Hanken Grotesk, standing in for Circular (Laurenz Brunner, Lineto, 2013)

Text · Neo-Brutalism

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.

Space Grotesk; Neo-Brutalism used Space Grotesk and Archivo Black

03

The colours

The ground and leading colours come from DTC 'Blanding', with a counter-accent from Neo-Brutalism. The ink reads on the ground at 4.5:1 or more.

DTC 'Blanding' / Millennial Minimalism Neo-Brutalism

  • #faf7f2 ground · 36%
  • #2b2b2b ink · 14%
  • #d27c5d accent · 18%
  • #ffc900 accent · 14%
  • #f4cfc8 accent · 10%
  • #23a094 accent · 8%

As CSS

:root {
  --ground: #faf7f2;
  --ink: #2b2b2b;
  --accent-1: #d27c5d;
  --accent-2: #ffc900;
  --accent-3: #f4cfc8;
  --accent-4: #23a094;
  --font-display: "Hanken Grotesk", sans-serif;
  --font-text: "Space Grotesk", sans-serif;
}

05

More combinations

With DTC 'Blanding'

All 18 combinations with DTC 'Blanding'

With Neo-Brutalism

Every style combination