Skip to main content

    Tabs

    Tabs organize related content by grouping similar information into views or tab panels that are displayed one at a time.

    Tabs vs. ToggleButtonGroup

    An example of a Tab component next to a ToggleButtonGroup component.

    An example of a Tab component next to a ToggleButtonGroup component.

    Tabs

    • Use Tabs to organize content and navigate within a view or context. Only one tab can be active at a time.
    • Selecting one of the tabs always replaces the entire content in the tab's content area.

    ToggleButtonGroup

    • Use ToggleButtonGroups with closely related choices that control certain parts of a given view. You can only select one option at a time.
    • Selecting one of the choices usually affects existing content, for example, by filtering it or changing the visual appearance, such as switching from list view to grid view.
    • Use ToggleButtonGroups for a maximum of about five choices. If more are available, consider using a Select.
    • Never use ToggleButtonGroups for navigational purposes. Instead, use Tabs.
    Still have questions?
    Find answers in the Dynatrace Community