/uploads/files/2/Projects/Concordia Grid/post_171013_115209.png

Still downloading random grids from the internet? Why not create your own and fill it with values that work for your project.

Set up your body copy properties together with preferred microblock ratios and calculate them into a system. Choose between multiple columns and gutter options to match your styling preferences and export your grid as Sketch or Photoshop file.

1280px / 1:1 / 5px baseline / 12 columns
3:2 Ratio / 12px baseline / 9 columns
16:9 Ratio / 16px baseline / 6 columns

Because, why you should fit an elephant into the fridge? Nobody needs that. Instead, build a custom-made jungle that will fit your elephant with a breeze. Then spice it up with some other animals of your very taste.

/uploads/files/2/Projects/Concordia Grid/article.gif

For a detailed view on the process behind Concordia algorithm development, implementation and a topic of grid calculations take a look at detailed project case study. Also, don't be greedy, share this page with your fellow designers.

Made by
Arsen Batyuchok
Nazar Grabovsky
Algorithm Design
Ross Sokolovski
Direction, Design
Next Project
The Prudence Review