Grids

Whenever starting a project, consider working with a flexible grid that performs well across different digital devices.

Column and row count, intervals and margins

  • Max (reference MBP 14″@1x – 1512 x 982px)
    • Columns –12 columns, 85px width, 16px gutter, centered, auto margins
    • Rows –16px height, 16px gutter
  • Min (reference iPhone 8@1x – 375 x 667px)
    • Columns – 4 columns, auto width, 16px gutter, stretched, 16px margins
    • Rows –16px height, 16px gutter