Style combination · Pairs well
Generative × HfG Ulm Systematic Design
Use Ulm's parameter-driven manual as the rule set behind a generative identity, so variation stays inside a coded system.
Mix them and make something Generative 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.
Generative & Dynamic Identities HfG Ulm Systematic Design
- Type from HfG Ulm Systematic Design
- Colour from HfG Ulm Systematic Design
- Form from Generative
- Composition from Generative
- Surface from Generative
02
The type
Open fonts standing in for each style’s own type, which is often hand-drawn or commercial.
Text · Generative
Identity systems designed as rules rather than fixed marks: logos and graphics generated by code, data or parameters so that they vary endlessly while staying recognisable. Anticipated by Karl Gerstner's Designing Programmes (1964) and launched by projects such as Sagmeister's Casa da Música (2007) and TheGreenEyl's MIT Media Lab identity (2011), the approach now spans responsive, data-driven and AI-assisted brands.
Inter; Generative used Neue Haas Grotesk and Variable fonts
03
The colours
The ground and leading colours come from HfG Ulm Systematic Design, with a counter-accent from Generative. The ink reads on the ground at 4.5:1 or more.
Generative & Dynamic Identities HfG Ulm Systematic Design
-
#f4f4f1ground · 36% -
#1b1b1bink · 14% -
#f2b01eaccent · 18% -
#0091ffaccent · 14% -
#8a8d8faccent · 10% -
#ffd400accent · 8%
As CSS
:root {
--ground: #f4f4f1;
--ink: #1b1b1b;
--accent-1: #f2b01e;
--accent-2: #0091ff;
--accent-3: #8a8d8f;
--accent-4: #ffd400;
--font-display: "Inter Tight", sans-serif;
--font-text: "Inter", sans-serif;
}
04
The two styles
05
More combinations
With Generative
- Hand-Painted Signage & Vernacular Lettering Contrasts · Hand-painted lettering's one-off irregularity is the human counterpart to algorithmic variation; mix the two only with clear intent.
- Op Art Graphics Pairs well · Op Art's line modulation and moiré are ready-made rules for patterns that respond to data or motion.
- Corporate Identity Modernism Pairs well · Keep one invariant element from corporate modernism, such as a fixed wordmark or colour, so the variable identity stays recognisable.
- International Typographic Style Pairs well · Use a Swiss modular grid as the fixed frame so generated variants stay coherent across the whole system.
- Dark Tech Minimalism Pairs well · Run a generative shader or particle field behind the hero to replace stock imagery with live, on-brand texture.
- Kinetic Typography & Variable Type Pairs well · Drive the variable axes with data or sound so the type responds to input rather than merely looping.
- Generative-AI Image Aesthetic Contrasts · Rule-based generative identity designs the system and accepts abstract variation; AI imagery averages toward realism, so decide which kind of 'generative' a brief needs.
- Milanese Industrial Modernism (Olivetti, Pirelli, Studio Boggeri) Pairs well · Pintori's cascades of numerals and dots are proto-generative; code them as rules to drive a contemporary variable identity.
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.
- Isotype Pictorial Statistics Pairs well · Combine Ulm's rulebook rigour with Isotype's counted pictograms to build wayfinding and data systems that stay legible across languages.
- 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.