Responsive layouts in material design adapt to any possible screen size. This UI guidance includes a flexible grid that ensures consistency across layouts, break-points details about how content reflows on different screens, and a description of how an app can scale from small to extra-large screens.
The New Breakpoints
For optimal user experience, material design user interfaces should adapt layouts for the following break-point widths: 480, 600, 840, 960, 1280, 1440, and 1600dp.
1. Summary and detail view content in layouts
- Layouts under 600dp wide may fill the screen with a single level of content hierarchy (either summary or detail content, but not both).
- Layouts over 600dp wide may place two levels of content hierarchy on the screen (both summary and detail content).