Mood & theme · 1980s–present
Industrial
Raw materials and honest structure: exposed concrete, oxidised metal, riveted steel, and the austere beauty of functional factory spaces.
Live preview base style — press Wear
$2,100
Revenue, up 12% from last month.
| Customer | Plan | Status | MRR |
|---|---|---|---|
| Northwind | Studio | Active | $1,240 |
| Acme Labs | Team | Trial | $0 |
| Kaldi Coffee | Studio | Active | $860 |
Use this style 16 tokens
- --bg
oklch(20% 0.01 66) - --fg
oklch(88% 0.008 72) - --muted
oklch(56% 0.01 68) - --surface
oklch(26% 0.012 65) - --surface-2
oklch(32% 0.014 62) - --border
oklch(40% 0.015 65) - --accent
oklch(67% 0.22 44) - --accent-fg
oklch(10% 0 0) - --focus
oklch(70% 0.22 44)
| Token | Value |
|---|---|
| --font-body | 'Helvetica Neue', Helvetica, Arial, system-ui, sans-serif |
| --font-display | 'Big Shoulders Stencil Display', 'Helvetica Neue', Helvetica, sans-serif |
| --font-mono | ui-monospace, 'SFMono-Regular', monospace |
| --radius | 0px |
| --radius-sm | 0px |
| --shadow | 0 2px 6px oklch(4% 0 0 / 0.6) |
| --shadow-lg | 0 12px 36px oklch(2% 0 0 / 0.7) |
@import url('https://fonts.googleapis.com/css2?family=Big+Shoulders+Stencil+Display:wght@700;900&display=swap');
:root {
--bg: oklch(20% 0.01 66);
--fg: oklch(88% 0.008 72);
--muted: oklch(56% 0.01 68);
--surface: oklch(26% 0.012 65);
--surface-2: oklch(32% 0.014 62);
--border: oklch(40% 0.015 65);
--accent: oklch(67% 0.22 44);
--accent-fg: oklch(10% 0 0);
--focus: oklch(70% 0.22 44);
--font-body: 'Helvetica Neue', Helvetica, Arial, system-ui, sans-serif;
--font-display: 'Big Shoulders Stencil Display', 'Helvetica Neue', Helvetica, sans-serif;
--font-mono: ui-monospace, 'SFMono-Regular', monospace;
--radius: 0px;
--radius-sm: 0px;
--shadow: 0 2px 6px oklch(4% 0 0 / 0.6);
--shadow-lg: 0 12px 36px oklch(2% 0 0 / 0.7);
}Where it came from
Origin: Post-industrial architecture; factory-to-loft conversion culture; brutalist revival
Industrial aesthetic grew from the conversion of factories and warehouses into living and working spaces from the 1980s onwards. It celebrates what modernism tried to hide: structure, material, seam, and bolt. In graphic design it pairs with heavy sans-serif type and a palette of concrete greys and rust oranges. It appears in architecture, fashion, manufacturing, and any brand that wants to signal no-nonsense toughness.
How to spot it
- Concrete greys and weathered rust-orange as the palette
- No decorative elements — structure itself is the aesthetic
- Wide-tracked uppercase sans-serif typography
- Heavy rules, riveted borders, and reinforced surfaces
Trade-offs
| Strengths | Weaknesses |
|---|---|
| Communicates durability, honesty, and no-nonsense quality | Cold and unwelcoming for consumer or lifestyle brands |
| Ages well — doesn't depend on soft trend colours | Concrete textures add visual weight to small surfaces |
| Strong contrast ratios, easy to make accessible | Can read as masculine in a way that excludes audience segments |
In the wild
- Industrial design studio and manufacturing brand identities
- Workshop, hardware, and tool product websites
- Architecture and construction firm digital presences
Use it when
The product is physical, durable, or craft-based — and the audience values function over feeling.