WELCOME
Telescope Design System > Foundations > Spacing&Grids
Spacing
Working with a defined spacing system allows to work faster and more consistently. Consistent and scalable spacing helps eliminate guesswork whilst designing and developing.
Guides
Name
Size (16px Base)
Pixels
Space
1
0.25 rem
4 px
4 px
2
0.5 rem
8 px
8 px
3
1 rem
16 px
16 px
4
1.5 rem
24 px
24 px
5
2 rem
32 px
32 px
6
3 rem
48 px
48 px
7
4 rem
64 px
64 px
8
8 rem
128 px
128 px
Grids
Layout grids define structure, hierarchy, and rhythm in design. Working from a defined layout system allows to work faster and more consistently, removing guesswork as lay out responsive designs.
Grid Layouts
Desktop
1440 px
Margin: 12 px
Gutter: 24 px
Tablet
800 px
Margin: 12 px
Gutter: 16 px
Phone
395 px
Margin: 12 px
Gutter: 12 px