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 | |
|---|---|---|
| Width | 1280 | 80 |
| Height | 800 | 50 |
| Margin | 20 | 1,25 |
| Columns | 16 | - |
| Column Width | 70 | 4,375 |
| Column Space | 8 | 0,500 |
| Gutter | 18 | 1,125 |
| Header | 24 | 1,500 |
| Icon max | 20 | 1,25 |
| Icon min | 16 | 1 |
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.
This is a work in progress. Not final!!!
Best PracticeÂ
Dark Theme.
This is a work in progress. Not final!!!
Best PracticeÂ
Light Theme.
This is a work in progress. Not final!!!


