Gravit Designer - Bootstrap 4 Grid Template - Joey "XJoeyV" de Vries - Junior web developer and computer

Gravit Designer - Bootstrap 4 Grid Template

We all love bootstrap 4 and we like their grids. Therefore a grid template for an amazing free tool Gravit Designer. So what is it and how it works?

What is gravit designer?
Gravit Designer is simple and fast tool to illustrate or design a vector based logo, also it is perfect to prototype websites in or make presentations.

Template Project
I work with Bootstrap since day 1 of my web development career this because I wanted to learn functional stuff and not be busy with designing websites. Bootstrap was and is my way to go. I can dream it. And build quickly a decent looking website.

But in the most case's it is good to prototype your website in a sort of image. Tools for this are Photoshop, Muse, Sketch or Gravit Designer. But making that prototype with any idea where your gaps are and where the columns are of your grid makes it hard and sometimes will change the outcome from image to web tremendously. This is why I made a grid template for it.

The Template
This grid template will contain 2 Pages one for the Fluid Container ( .container-fluid ) and the other one for the normal Container ( .container ). You can select the preferred template in the pages section. The other one can be deleted.

The red section is 1 column, and whitespace between it is the gap between each column. If you design on 2 columns the gap between the 2 columns is not applied so it is space for you to design in.

Tips and Tricks

  • If you use rules on the side of the columns, you are ganna use you can snap your elements to it when designing.

Download it NOW
Instead of making my own downloading page I found last minute GumRoad to publish it on. Soon all the Free Products and Paid Products will be listed on my Store Page. For now you can grab the Template via here: Gravit Designer - Bootstrap 4 Grid Download

📧 📞