Bauhaus goes web
CSS-grid inspired by the design of a poster
The other day I came across an old bauhaus-poster and was so inspired, that I hade to make something out of it in code. The advantage is that on the web you can play more on how it should look like on smaller screens as well.
For this one I used display: grid to lay out the grouped arcs and the headline. A background property called repeating-radial-gradient to make those arcs and writing-mode: vertical-rl for the text on smaller screens.
This is CSS-propertys that I don’t use at work in daily life, so it was fun playing with it.