Grid list header/footers
Single-line header/footer
Height: 48dp
Text padding: 16dp
Default font size: 16sp
Secondary action is flush right to the footer.
Two-line header/footer
Height: 68dp
Text padding: 16dp
Default font size for each line: 16sp/12sp or 14sp/14sp
Type 14/14
Two-line bar (with icon) height: 68dp
Two-line bar height: 68dp
Single-line bar height: 48dp
Type 16/12
Two-line bar (with icon) height: 68dp
Two-line bar height: 68dp
Single-line bar height: 48dp
Text truncation in header/footers.
Image-only grid list
Grid list padding: 4dp or 1dp
Tiles in grid lists can span multiple columns.
Carefully consider whether secondary text is needed in grid lists that use multi-column tiles, as larger tiles can develop significant empty space.
Image-only grid list
Image-only grid list photo album
Single-line grid list
Text only
Height: 48dp
Text padding: 16dp
Default font size: 16sp
Grid list padding: 4dp or 1dp
Single-line grid list footer with 16dp padding
Single-line grid list photo album
Single-line grid list header with 16dp padding
Text with icon
Height: 48dp
Text padding: 16dp
Default font size: 16sp
Grid list padding: 4dp or 1dp
The secondary action can be flush right or flush left within the footer or header.
Single-line grid list header with 16dp padding and icon
Single-line grid list footer with icon
Single-line grid list footer with 16dp padding and icon
Single-line grid list header with icon
Single-line grid list footer with icon in photo album
Two-line grid list
Text only
Height: 68dp
Text padding: 16dp
Default font size for each line: 16sp/12sp or 14sp/14sp
Grid list padding: 4dp or 1dp
Two-line grid list footer with 16dp of padding
Two-line grid list header with 16dp of padding
Two-line grid list, 4dp example
Two-line grid list, 1dp example
Text with icon
Height: 68dp
Text padding: 16dp
Default font size for each line: 16sp/12sp or 14sp/14sp
The secondary action can be flush right or flush left within the footer or header.
Grid list padding: 4dp or 1dp
Two-line text with icon footer
Text padding: 16dp
Two-line text with icon
Two-line text with icon
Two-line text with icon header
Text padding: 16dp
Example of text with icon