1919–1933
Bauhaus
A modern screen interpretation of the Bauhaus school, which operated from 1919 to 1933. Geometric studies are a useful reference, but red-yellow-blue graphics are only one part of its varied output.
What defines it
- Geometric composition
- Visible hierarchy
- Economical forms
What it asks of the project
- Reading & layout
- Compact spacing for scanning
- Visual emphasis
- bold · geometric
- Implementation
- Mostly standard CSS; imagery may still need preparation.
- Images & assets
- Simple geometric artwork can be made with CSS or SVG.
Color in use
An exhibition index with a geometric title panel and disciplined event rows.
Accent labelOpaque text/surface: 21.00:1 · Text/accent: 4.97:1.
These pairs meet the normal-text minimum; check other surfaces separately.
Context
Compare the geometric balance, color blocks, and directional lettering. These are contemporary poster references, not a catalog of original Bauhaus works.
The Met: The Bauhaus, 1919–1933
View collected reference imagesBuild it
- Use a modular grid
- Let one geometric form anchor the composition
- Assign primary colors distinct visual roles
Typography
Use a geometric sans-serif for display and a readable sans-serif for details; geometry should not distort long text.
Watch out for
Reducing the school to decorative circles or claiming every Bauhaus work rejected ornament in the same way.
A working interpretation
Original CSS composition with the same content and controls used in every direction. Image-led styles need additional artwork for their full expression.
Open the full example →Hand it to an agent
Point your agent at this guide, or save the files below.
Check the result
- Confirm: use a modular grid.
- Confirm: let one geometric form anchor the composition.
- Confirm: assign primary colors distinct visual roles.
- Review specifically for: Reducing the school to decorative circles or claiming every Bauhaus work rejected ornament in the same way.