platform-guideline checked
Material Design Responsive Layout Grid
Documents responsive grid columns, gutters, margins, breakpoints, and layout behavior used to arrange card-based surfaces consistently across screen sizes.
Pattern Decisions This Source Supports
| Pattern | Supported decision | Required contract | Claim note |
|---|---|---|---|
| Card grid | Choose card grid when users need to see multiple objects at once and visual preview or compact card identity helps them choose. | Each card represents one object and keeps title, preview, key metadata, state, and actions in the same relative positions across cards. | Supports responsive columns, gutters, margins, and breakpoint behavior for arranging card grids. |
| Dashboard layout | Choose dashboard layout when the user's task is monitoring or triaging multiple related signals on one page. | Dashboard title, purpose, active filters, and last updated time apply visibly to the widgets they govern. | Material documents responsive columns, gutters, margins, and breakpoints used to keep dashboard layouts orderly. |
| Responsive navigation adaptation | Choose responsive navigation adaptation when the navigation surface itself must change across viewport, posture, orientation, or destination-count constraints. | The adapted surface changes presentation, not the user's destination model. | Supports breakpoint and grid reasoning for responsive layout adaptation. |
Evidence Role
This source is treated as platform-guideline evidence. Use it to validate the decision rules above, not as a visual style reference.
Publisher: Google Material Design. Last checked: .