Line25

30 Blocky Website Designs Based on a Square Grid

30 Blocky Website Designs Based on a Square Grid
Home » Articles » 30 Blocky Website Designs Based on a Square Grid

June 05, 2018

Line25 is reader supported. At no cost to you an affiliate commission may be earned when a purchase is made through various links on our site. Learn more

Grids give a website design structure and balance, but some grid layouts are more obvious than others. The most basic of grids is the square block, where the page is divided up horizontally and vertical with equally spaced gridlines. The content then fills the grid like a chequerboard pattern, or elements can span multiple blocks to form larger content areas. Today’s showcase features 30 perfectly balanced sites that are all based on a blocky square grid.

The Conference

The ConferencePin

Simon Foster

Simon FosterPin

Peachey Photography

Peachey PhotographyPin

ELI

ELIPin

Jonathan Patterson

Jonathan PattersonPin

Sivert Høyem

Sivert HøyemPin

Script & Seal

Script & SealPin

Guy Moorhouse

Guy MoorhousePin

PFD

PFDPin

The Escape Committee

The Escape CommitteePin

Jan Finnesand

Jan FinnesandPin

Sebastian Sejer & Co

Sebastian Sejer & CoPin

Julian Weidenthaler

Julian WeidenthalerPin

Dumbo Townhouses

Dumbo TownhousesPin

WeLoveNoise

WeLoveNoisePin

Float

FloatPin

Incredible Types

Incredible TypesPin

Etch

EtchPin

Hommard

HommardPin

adaptable

adaptablePin

Heydays

HeydaysPin

Matchstic

MatchsticPin

Résidence Mixte

Résidence Mixte Modular Grid LayoutsPin

Heavy Heavy

Heavy HeavyPin

Jonathan Da Costa

Jonathan Da CostaPin

MAP

 

MAPPin

Hatch

Hatch San Francisco Modular Grid LayoutsPin

Atlason

AtlasonPin

Script & Seal

Script & Seal Modular Grid LayoutsPin

Yvan Rodic

Yvan RodicPin

Design Your Life

Design Your Life Modular Grid LayoutsPin

Written by Iggy

Iggy is a designer who loves experimenting with new web design techniques, collating creative website designs, and writing about the latest design trends, inspiration, design freebies, and more. You can follow him on Twitter

14 Comments

Would you like to say something?

  1. Aftab says:

    its nice post.

  2. نمای ساختمان says:

    yashasin azerbaycan

    chox sagolun

  3. Bibble Studio says:

    These are so beautiful! Thanks for the share! Been looking for some inspiration for a new project fromBibble Studio and think I have certainly found a good collection

  4. Brian says:

    This is great! Love your roundups.

  5. Greg says:

    There some really good designs in this list. TFS!

  6. The Codexpert says:

    Nice collection, Thanks for sharing!!!!

  7. Jinja says:

    Inspirational designs, thanks for sharing!

  8. دانلود اهنگ چدید says:

    https://parsianmusic.eu/

  9. خرید سرور مجازی says:

    https://golbarghosting.org/

  10. lairah says:

    This is really nice! thanks

  11. دانلود فیلتر شکن says:

    Thanks for your good content. I hope good luck

  12. Tad Chef says:

    Excellent collection. There is one mistake though: Arbeiten is German and means simply “works”. The site is called julianweidenthaler.com

    • Chris Spooner says:

      Well spotted, “Arbeiten” is now the first German word I know!

      Just updated the title of the link.

Please Share