Tabs

Tabs are interactive elements that organise content into separate sections or views.

Overview

The purpose of tabs is to simplify navigation and provide a clear organisation of content. They offer an intuitive way for users to switch between different sections or views within the same interface, reducing clutter and improving the user experience.

When a user clicks or taps on a tab, the corresponding content is displayed while hiding the content of other tabs. This allows users to switch between different sections of the interface without navigating to separate pages or screens.

A group of tabs that are horizontally stacked together.

Resources

Figma Component	Available
Figma Documentation	Available
Web Components	Planned
Vue [Fozzie]	Available
React [Snacks]	Available
iOS JustUI [UI Kit]	Available
iOS PIE [SwiftUI]	Available
Android [XML views]	Planned
Android [Jetpack compose]	Alpha