from dessau to the design system

Nothing in this system was invented here. Every rule has a date and a place, and most of them have a book. This is the short version of the line that runs from the Dessau workshops to the stylesheet on this site.

1928: the new typography

Jan Tschichold saw the 1923 exhibition and wrote the rulebook the school never quite wrote for itself. Asymmetry, sans serif type, the page as a field of forces, white space as a material. Our rules for left alignment, for the dominant block and for one typeface descend from Die neue Typographie almost unchanged.

1953: ulm

Max Bill had been a Bauhaus student. In 1953 he opened the Hochschule für Gestaltung in Ulm and became its first rector, and the school took the Bauhaus method and turned it toward systems: product families, signage, information design, the idea that a company could have one visual language across everything it made. The notion that a brand, a product and a poster follow the same grammar is an Ulm idea. So is the word Gestaltung itself, which means something closer to giving form than to design.

1957 and 1981: the swiss grid

Helvetica appeared in 1957. Emil Ruder's Typographie followed in 1967 and Josef Müller-Brockmann's Grid Systems in Graphic Design in 1981, and between them the International Typographic Style, usually just called Swiss, made the modular grid a discipline rather than a habit. Twelve columns, mathematical gutters, type sizes in a scale, everything aligned to a structure the reader never sees. Our layout page is a Swiss page with a Bauhaus palette.

2013: atomic design

The web took the grid and lost the system for a while; every page was its own layout. Brad Frost's atomic design, written in 2013, put the pieces back in order: atoms, molecules, organisms, templates, pages. Our components, controls, patterns and templates are the same ladder with plainer names. The insight is the Ulm insight again: a page is assembled, not drawn.

2014: the token

Around the same time, the team building Salesforce's design system named the smallest unit: the design token, a value with a name that both design tools and code could read. It is the last piece. The Bauhaus had workshops making prototypes for industry; a token is a prototype for a decision, made once and manufactured everywhere.

2026: werkstatt

So the system is a Bauhaus palette and a Bauhaus set of shapes, set on a Swiss grid, assembled the atomic way, stored as tokens. None of those is original and all of them are chosen. What the school would have recognized is not the stylesheet but the method: a small alphabet, learned by everyone, applied to everything, from the poster on the wall to the button under the thumb.