More Bootstrap 4 Themes & Tools

Bootstrap 4 Grid for Affinity Designer

by Alexander Rechsteiner - Posted

Gutter Columns

Ever since Affinity Designer entered public Beta on Windows, I was delighted with the tool. It just seems so much more intuitive, well thought out and lightweight than any of the competing Adobe tools. The program is evolving rapidly and Serif does an excellent job of responding to the community in their forums. Affinity Designer has since been released fully on Windows and I’ve decided to switch to it for all UI/UX and web design tasks.

To help with design projects based on Bootstrap 4, I have created a grid template for Affinity Designer akin to my Photoshop template for Bootstrap 4.

The features are pretty much exactly the same:

  • Artboards for xl, lg, md and sm viewport sizes
  • Shape objects for columns and gutters
  • Screen size helpers for common screen sizes
  • Test images rendered in an actual browser
  • Guides along the column borders
  • Based on Bootstrap 4 alpha 6
  • Non-artboard version for xl

For more a more detailed explanation of these features, refer to the article about the Photoshop template. This template is free to use. If you find this useful, consider sharing this with your friends, followers and colleagues.

As always, feedback is welcome. You can reach out via email or Twitter.