List

List guideline is updated on 18 Sept 2018

A list is a collection of rows that display information on the web interface. Lists composed of items containing primary and supplemental actions, which are represented by icons and text.

List Spacing Guideline

Regular List Measurement
Compact List Measurement

List

Type Idle Hover / Mobile Active Active
With icon
List label
List label
List label
Without icon
List label
List label
List label

List with checkboxes

Type Idle Hover / Mobile Active Active
Primary level (Single line)
List label
List label
List label
Primary level (Double lines)
Long list label that runs multiple lines
Long list label that runs multiple lines
Long list label that runs multiple lines
Secondary level (Single line)
List label
List label
List label
Secondary level (Double lines)
Long list label that runs multiple lines
Long list label that runs multiple lines
Long list label that runs multiple lines