Tabs

Use tabs when there are multiple categories/views/panes of content, but there is the need to only show one pane at a time.

Don’t use tabs for pagination of content or cases involve viewing content, not navigating between groups of content. Tabs can not be nested or be mixed with icons or button styles.

To select the active tab add the attribute aria-selected="true" and that list item will have the correct styling.

View example of the tabs pattern