top of page

How to Create an Image-Based Grid Layout for Your Website


Enhance your website with an asymmetrical image-based grid

Illustration: Yarin Ben Hamo

It may be true that we’re naturally drawn to symmetry. But it doesn’t mean that we can’t spice things up every once in a while. Whether you’re an illustrator, architect or fashion designer, an asymmetrical grid layout can shed a totally new light on your works. Notice how the website featured below does just that, resulting in minimalistic visuals and a sense of harmony.

The fun doesn’t stop here. Boast more of your art by linking each image on your grid to an inner project page. This way, you can create full in-depth galleries and enrich your online portfolio. To discover how to achieve that same clean look and maintain a unified visual language throughout your website, just hit the “Play” button, and follow the steps of this video tutorial.

Ready to put it into practice? Get behind the scenes of this Wix demo-site, and start playing.

Website Template with Image-Based Grid Layout
The website featured in this tutorial


Feb 26, 2024

Feel the Burn: What does it mean to experience creative burnout?

Designer Spotlight with Dmitry Rusinov

Mentor Spotlight with Kobi Michaeli

bottom of page