Style combination · Pairs well
Isotype Pictorial Statistics × HfG Ulm Systematic Design
Combine Ulm's rulebook rigour with Isotype's counted pictograms to build wayfinding and data systems that stay legible across languages.
Mix them and make something Isotype Pictorial Statistics HfG Ulm Systematic Design
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.
Isotype Pictorial Statistics HfG Ulm Systematic Design
- Type from HfG Ulm Systematic Design
- Colour from HfG Ulm Systematic Design
- Form from Isotype Pictorial Statistics
- Composition from Isotype Pictorial Statistics
- Surface from Isotype Pictorial Statistics
02
The type
Open fonts standing in for each style’s own type, which is often hand-drawn or commercial.
Text · Isotype Pictorial Statistics
A method of visual education developed by Otto Neurath, Marie Neurath (Reidemeister) and Gerd Arntz in Red Vienna from 1925, which turns statistics into rows of identical pictograms where a greater quantity is shown by more signs, never by bigger ones. Continued in The Hague and Oxford until 1971, its standardised symbols, flat colours and sans-serif captions laid the foundations of modern information graphics and pictogram systems.
Jost; Isotype Pictorial Statistics used Futura and Gerd Arntz's linocut pictogram set (c. 4,000 signs), used like a fount of picture-type
03
The colours
The ground and leading colours come from HfG Ulm Systematic Design, with a counter-accent from Isotype Pictorial Statistics. The ink reads on the ground at 4.5:1 or more.
Isotype Pictorial Statistics HfG Ulm Systematic Design
-
#f4f4f1ground · 36% -
#1b1b1bink · 14% -
#f2b01eaccent · 18% -
#c8372daccent · 14% -
#8a8d8faccent · 10% -
#2c5aa0accent · 8%
As CSS
:root {
--ground: #f4f4f1;
--ink: #1b1b1b;
--accent-1: #f2b01e;
--accent-2: #c8372d;
--accent-3: #8a8d8f;
--accent-4: #2c5aa0;
--font-display: "Inter Tight", sans-serif;
--font-text: "Jost", sans-serif;
}04
The two styles
05
More combinations
With Isotype Pictorial Statistics
- International Typographic Style Pairs well · Set Isotype rows of pictograms on a Swiss grid for public information that is rigorous yet friendly.
- Socialist Realist Propaganda Poster Contrasts · Socialist Realism dramatises with heroic figures while Isotype persuades by counting; choose evidence over emotion when trust matters.
- Flat Design Pairs well · Flat icon sets are Isotype's heirs; apply its one-symbol-one-meaning rule to keep an icon family consistent.
- Corporate Memphis Contrasts · Corporate Memphis uses flat figures for mood; Isotype's figures always count something, so use people icons only when they carry data.
- Ancient Egyptian Hieroglyphic & Register Composition Pairs well · Otto Neurath called his visual autobiography From hieroglyphics to Isotype, with chapters on hieroglyphics through the centuries and their renaissance; borrow the rule-bound sign family and rows of standing figures, but note the opposite rule of size: Isotype shows more by adding signs of equal size, Egypt shows rank by making one figure bigger.
- Data Humanism Contrasts · Isotype fixes one standard sign per thing and counts by repeating it so anyone can read the chart; data humanism invents a new code for each dataset and asks for slow reading. Choose Isotype for public information, data humanism for portraits of particular lives.
- Schematic Transit Diagram (Beck Tube Map Idiom) Pairs well · Add pictorial statistics beside the diagram to carry quantities as well as connections.
- Warli Painting Contrasts · Both build people from a few reduced shapes and repeat them in rows; Isotype's figures count data in flat colours on a light ground, Warli's narrate ritual and village life in white on earth, so borrow the repetition but not the meaning.
With HfG Ulm Systematic Design
- Victorian Letterpress & Wood Type Contrasts · A Victorian mixed-face handbill is the clutter Ulm's one-family rule was meant to cure; use it as a before-and-after foil.
- Dada Contrasts · Dada's chance operations expose what Ulm's method suppresses; one deliberately random element can humanise an over-engineered system.
- Generative & Dynamic Identities Pairs well · Use Ulm's parameter-driven manual as the rule set behind a generative identity, so variation stays inside a coded system.
- Plain Tobacco Packaging Contrasts · Ulm's coded colours, single type family and manual built recognition for Braun and Lufthansa; plain packaging uses the same rule-bound specification to erase it, a reminder that a design system can suppress identity as well as build it.
- Googie & Atomic Age Contrasts · Ulm's anti-styling functionalism is its sober opposite; use the contrast to calibrate how much showmanship a brand can bear.
- Neumorphism Pairs well · Model controls on Braun-style product design from the Ulm tradition: knobs, sliders and grilles that look moulded from one material.
- Munich 1972 Olympic Design (Otl Aicher) Contrasts · Aicher's own Ulm method (one grid, one grotesque, a manual) applied to a public festival instead of a company: Lufthansa's dark blue, yellow, black and white give way to a landscape spectrum of blues, greens, silver and oranges, pictograms and posterised photographs. Start from Ulm for a corporate system, from Munich when the system must feel friendly.
- British Road Signage (Kinneir & Calvert) Contrasts · Both govern design by a written rule book, but Ulm ruled a company's print with a flush-left grid and one grotesque, while the Worboys kit rules roadside panels through colour, shape and pictogram codes read at speed; start from Ulm for a corporate programme and from the road signs when the reader is moving.