Grid
Common breakpoints (mobile first)
These are guidelines, not strict rules. In general you should add a breakpoint whenever the design requires it, not whenever these guidelines say so.
| Ems | Px | What happens above this breakpoint: |
|---|---|---|
| 38em | 608px | Generic grids expand from single- to multi-column (anything below this is considered "Mobile") |
| 40em | 641px | Comparison tables expand from single- to multi-column |
| 48em | 768px | Mobile menu becomes desktop menu |
| 55em | 880px | Layout grids expand from single- to multi-column |
| 70em | 1120px | Column widths expand slightly (anything above this is considered "Desktop") |