Josef Müller-Brockmann

Grid systems

in graphic design

A visual communication manualfor graphic designers,typographers, andthree dimensional designers

Raster systeme

für dievisuelle Gestaltung

Ein Handbuch fürGrafikher, Typographen undAusstellungsgestalter

Niggli

CSS Grid a Day

This is the ‘CSS Grid a day’ entry for May 1.

An example of using CSS grid every day, running from May 1–31st, 2019.

About this entry

Josef Müller-Brockmann’s classic, “Grid systems in graphic design” provides essential reading for the designing and rationalisation of grid systems used in print design.

Recreating the cover with CSS Grid seemed like a good starting point for this 30 day project.

I had to use far too many magic numbers and hacks than I’d have liked to. Responsive text-fitting was accomplished with <svg> tags, with width set to 100% (hat tip to CSSTricks).

← Prev
IndexNext →