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")|