Group Headers & Dividers

Group headers and Dividers create divisions between groups of content items as well as between the content items themselves.

Example Group headers
Example: Contacts app showing group headers
Example Divider
Example: Mail app showing dividers

Group header usage:

  • Separates groups or sections within a view (e.g. grouping a contact list alphabetically).

Divider usage:

  • Creates visual separation between list items which contain complex combinations of text, images and controls (e.g. an email inbox list). Dividers are not needed for simple lists such as the Contacts list shown above.