Tabs

Use tabs to divide large amounts of related data or options into more digestible, focused groups with the goal of aiding content navigation or content organization, without the need to navigate away from the current context.

Although tabbed content may be navigational in nature (e.g., map route options that change a map view, search results leading to other sites), tabs are not themselves used for navigation.

Tabs are also not used for carousels or pagination of content (for example, swiping between pages of apps).

Tabs are presented as a single row.

Tabs should not be nested. That is, content in a tab should not consist of another set of tabbed content.

A set of tabs contains at minimum a pair of tabs and no more than six tabs.

Tabs control the display of content in a consistent location.

The tab corresponding to the visible content is highlighted.

Tabs are grouped together and the group of tabs are in turn connected with their content.

Keeping tabs adjacent to their content helps maintain the relationship between the two, as too great a separation can introduce ambiguity.

Fixed tabs display all tabs concurrently and are best used with content that benefits from quick pivots between tabs (e.g., switching transportation methods for directions in Maps).

The maximum number of tabs is effectively limited by the view’s width. Fixed tabs have equal width, based on the widest tab label. To navigate between fixed tabs, touch the tab or swipe the content area left or right.