The Grid

Spacing of the 
web min.

Here you can find all important values for building the tablet portrait grid. The grid is divided into two main containers. the header area and the content area.


px

rem

Width80048
Height102464
Margin80,5



Columns8-
Column Width875.438
Column Space80,500
Gutter80,500



Header483
Icon max483
Icon minn.nn.n




EdgeOne Boardlet example.
This is how the division of the boardlets within this representation could look like. The Edge One/dSFM layout serves as an example.


Best Practice 
Dark Theme.


Best Practice 
Light Theme.




X-Series Boardlet example.
This is how the division of the boardlets within this representation could look like. The X-Series/Objective layout serves as an example.




Best Practice 
Dark Theme.




Best Practice 
Light Theme.