Section header

A section header divides sections of a screen.

Section header
When to use

Use a section header:

  • to divide content with different purposes into sections within a screen
  • to introduce a list of items, and separate that list from the rest of the content on a screen
  • if here’s a single action that relates to the content in the section — for example, you could use the section header for a list with limited items, and a ‘See more' button to display the rest of them

Don't use a section header:

  • if you have a list that will always contain just one item — use a heading text style instead

Best practice
  • Keep the text short and relevant to the content in the section.
  • Don't include a link unless it's absolutely necessary.



Text should:

  • be no more than 3 words

  • use a noun that describes the information within the section, like ‘Account services’

  • not start with a verb or be an instruction (like ‘Select’ or ‘Choose')




Developer documentation




Web documentation