This page contains instructions to help customize and further develop this template.


The preloader element(s) can be found in the navigator under the component name "Preloader". The preloader is set to display: hidden as default.

In order to modify the preloader, simply double click the "Preloader" component, select any of its content and start designing.

In order to disable the preloader, simply disable the "Preloader - page load" interaction found in the page trigger interaction settings on every page.


This template contains quite a few custom components. All of these (with the exception of navigation & footer) can be found on the Components page in the page navigation to the left. Modifications to a component will reflect throughout the whole website.

Class naming conventions

This template adheres to fairly strict class naming conventions that combines the best practices of BEM (Block Element Modifier) and naming conventions found in the Webflow's template guidelines (following a Title Case descriptive format).

Classes are composed of three main entities:

  • Block
  • Element
  • Modifier

The Block represents the overarching "container" or "parent" of an element, the Element is a nested part within the Block, and the Modifier is an optional addition that alters the styling of an element.

These naming conventions makes it easier to create, modify and manage the styles and functionality of elements throughout the project, promoting consistency and efficiency in the development process.


The 12-column grid (class: Grid) can easily be used for a variety of scenarios, whether you need 2, 3, 4, 6 or 8 column layouts. Webflow also offers the flexibility of manual child element placement, allowing you to create more advanced layouts with ease.

Grid column breakpoints:

  • Desktop - 12 columns
  • Tablet - 8 columns
  • Mobile landscape - 4 columns
  • Mobile - 2 columns

Combo classes (modifiers) can be used to change the amount of columns on different breakpoints, change column/row spacing or extend the grid's functionality in whatever way you may need.


Did you find a bug in the template or is there a part of the template that remains unclear on how to work with? Feel free to send me an email and I'll make sure to take a look at it as soon as possible.

Bugs related to Webflow itself should be directed to Webflow support. Design related help can be found on the Webflow discourse forum.