List

Lists define the layout of the page content or groups of elements stacking them vertically or horizontally.

• Support any type of content: Lists can be used in any context from page-level layout to managing offsets between granular components. hey should work with any component used inside.
• Horizontal Stacking: Lists can be used for inline elements and they have to manage how they’re stacked horizontally, including handling offsets between multiple rows of elements.
• Divided Variant: Lists with dividers are the best practice advised by many platform guidelines (especially on mobile).
• Supports Actionable Content: Sometimes lists are used for grouping tappable components, where the whole area of the list item should be clickable.