Foundations
Spacing & Breakpoint
Spacing
Token | Pixels | Example |
---|---|---|
none | 0px | 👻 |
3xs | 1px | |
2xs | 2px | |
xs | 3px | |
sm | 4px | |
md | 6px | |
lg | 8px | |
xl | 10px | |
2xl | 12px | |
3xl | 14px | |
4xl | 16px | |
5xl | 20px | |
6xl | 24px | |
7xl | 32px | |
8xl | 36px | |
9xl | 40px | |
10xl | 44px | |
11xl | 48px | |
12xl | 56px | |
13xl | 64px | |
14xl | 72px | |
15xl | 80px | |
16xl | 88px | |
17xl | 96px | |
18xl | 112px | |
19xl | 128px | |
20xl | 144px | |
21xl | 160px | |
22xl | 192px | |
23xl | 208px | |
24xl | 224px | |
25xl | 240px | |
26xl | 256px | |
27xl | 288px | |
28xl | 320px | |
29xl | 384px |
Breakpoint
Breakpoint | Minimum width |
---|---|
Desktop | 1168px |
Tablet | 768px |
Mobile | 375px |
Company Logos
Grid System