Skip to content
search icon
clear
Component Status

Lists organise information into related groups of content.

Guidelines

Bullet lists

Bullet lists are used when order is not of importance.

Numbered lists

Numbered lists are used when order and hierarchy is needed.

FigmaExternal linkFigma design sketches of lists

Don't

  • Do not use lists to organise large amounts of information, use a Table instead.
  • Do not use lists as navigation.

Demo

Unordered list

  • List item
  • List item
  • List item
    • List item
    • List item
    • List item

Ordered list

  1. List item
  2. List item
    1. List item
    2. List item
    3. List item
      1. List item
      2. List item
      3. List item
  3. List item

Ordered list starting from 15

  1. List item
  2. List item
  3. List item
  4. List item
  5. List item
  6. List item
  7. List item
  8. List item
Edit this page on GitHub