← All Style Guides

BRUTALIST TYPOGRAPHY

Type is structure. Weight is power. The grid is a suggestion.

Color Palette

Monochromatic brutalism with signal accents. Color is used for emphasis, never decoration.

R Raw Black #0a0a0a
V Void #1a1a1a
S Shadow Grey #3d3d3d
R Rebar #8a8580
C Cement #b8b4aa
C Concrete #d4d0c8
S Slab White #f2f0eb
C Chalk #fafaf7
! Signal Red #e2231a
! Hazard Yellow #f5d800
! Oxide Orange #d4622b
! Formwork Blue #1a3a5c

Brutalist typography treats color the way Tadao Ando treats concrete: as a raw material, not a finish. The palette is predominantly grayscale, drawn from exposed aggregate and poured cement. Signal colors enter only when something demands attention — a warning, a break in the grid, a typographic collision. Color is force, not atmosphere.

Typography

Extreme weight contrast. Compressed display faces against hairline body text. Type as material.

Massive Display — Anton, Uppercase

HEAVY

Display — Anton, Uppercase

The weight of
a letterform is
its architecture

Condensed Display — Bebas Neue

STACKED
CONDENSED
LETTERFORMS

Heading — Anton

Raw typographic power

Subheading — Bebas Neue, Wide Tracking

Systematic Disruption of the Baseline

Body — Inter Light 300

Wolfgang Weingart shattered the clean Swiss grid in the 1970s, proving that typography could be expressive without abandoning structure. His students at Basel — April Greiman, Dan Friedman — carried this energy into American design. The brutalist typographic tradition treats every letterform as a building block, every weight change as a structural decision.

Body Heavy — Inter Black 900

When everything is heavy, nothing is. Contrast creates hierarchy.

Thin Display — Inter Thin 100

Delicate precision against brute force

Caption — Inter Regular, Wide Tracking

System metadata • Timestamp • Attribution • 2024

Weight Contrast Strip — Inter 100 through 900

Thin Light Regular Bold Black

Overlapping Type — Collision as Composition

OVERLAP
IS INTENTIONAL

Spacing

A rigid 4px base unit. Spacing is structural, not decorative. Gaps are as deliberate as fills.

XS 4px
SM 8px
MD 16px
LG 32px
XL 64px
XXL 128px
4px
8px
16px
32px
64px
128px
grid
slab

Buttons

Hard shadows, zero radius, condensed type. Buttons are structural elements, not decorations.

Forms

Minimal chrome. Bottom-border inputs. Condensed labels. The form is a grid of type.

Alignment
Approach

Cards

Structural containers. No radius, no shadow softness. Numbered, catalogued, filed.

01
Weight

The difference between 100 and 900 weight is not gradual. It is a tectonic shift. Use it to create hierarchy that cannot be ignored.

02
Overlap

When letterforms collide, they create new shapes. The intersection of two words generates a third meaning that neither carried alone.

03
Scale

A letter at 14rem is architecture. The same letter at 0.7rem is metadata. Brutalist typography lives in the tension between these extremes.

TYPE
IS
FORM
BREAK
THE
GRID
06
Texture

At sufficient scale and density, text stops being readable and becomes visual material. This is not a failure — it is an expressive choice with roots in concrete poetry and Dada.

Alerts

Signal-colored slabs with heavy left borders. The message is the material.

i
Information
Wolfgang Weingart began teaching at the Basel School of Design in 1968. His experiments with letterspacing, layering, and halftone screens redefined Swiss typography from within.
!
Caution
Extreme weight contrast without clear hierarchy creates visual noise, not visual power. Every collision must be intentional.
X
Error
The grid has been broken beyond repair. This is either a catastrophic failure or a masterpiece. Context determines which.
Note
David Carson once set an entire interview in Zapf Dingbats because the content bored him. Legibility is a choice, not a mandate.

Text as Texture

When type is scaled beyond readability, it becomes surface. Background and foreground collapse into material.

Material Language

At sufficient scale, every letter becomes a shape. Every word becomes a wall. The reader stops reading and starts seeing. This is the fundamental insight of brutalist typography: legibility is just one possible function of a letterform.

Grid Breaking

The grid exists to provide structure worth violating. Overlap, bleed, and collision are compositional tools.

STRUCTURE
COLLISION
The grid is a starting point, not a destination. Break it with purpose.
TENSION

Principles

The rules of brutalist typography. Follow them or break them, but know them first.

  1. Weight is Hierarchy

    The difference between thin and black is not aesthetic preference. It is structural engineering. A 900-weight heading above 100-weight body text creates an unambiguous reading order that no amount of color or size change can replicate.

  2. Overlap is Composition

    When Weingart layered type, he was not making a mess. He was making new forms from existing glyphs. Overlapping letterforms create visual intersections that carry meaning beyond either source word.

  3. Scale Creates Material

    A letter at caption size is information. A letter at display size is a shape. A letter at architectural scale is a wall. Brutalist typography uses all three registers and understands the transitions between them.

  4. The Grid is a Starting Point

    Swiss modernism gave us the grid. Post-modernism taught us to break it. Brutalist typography does both simultaneously — establishing structure precisely so that violations register as intentional, not accidental.

  5. Restraint in Color

    Monochrome is not a limitation. It forces every design decision into the domain of form: weight, scale, spacing, overlap. Color enters only as signal — a red that means stop, a yellow that means warning. Never ambient, always structural.

  6. Legibility is a Choice

    Not every piece of text exists to be read linearly. Some exists to be felt, to create atmosphere, to establish texture. The decision about whether type serves reading or seeing must be made consciously for every element.