Skip to main content

Components (Mobile)

Components are the building blocks of the design system designed with users in mind.

Components (Mobile)

Components are the building blocks of the design system designed with users in mind.

Mobile

The mobile library is specific to applications built for mobile devices.

Accordions

The accordion element delivers large amounts of content in a small space through progressive disclosure.

Alerts

Alerts provide contextual information about system status that persists until dismissed or resolved.

Badges

Badges are non-interactive labels which hold small amounts of information.

Bottom Navbars

Bottom navigation bars allow movement between primary destinations in an app.

Buttons

Buttons are interactive elements that trigger an action or an event.

Cards

Cards contain content and actions about a single subject.

Checkboxes

Checkboxes are used for a list of options where the user may select multiple options, including all or none.

Chips

Chips represent small blocks of information and are commonly used for input or filtering.

Inputs

Input fields collect information from users.

Lists

A list can be used to display content related to a single subject.

Messages

Messages provide the user with contextual static information. They have a lower priority than a notification or prompt.

Modals

Modal dialogs interrupt workflows and require user interaction.

Progress Bars

Progress indicators express an unspecified wait time or display the length of a process.

Radio Buttons

Radio buttons are used when options are mutually exclusive.

Scrollbars

Scrollbars allow user to scroll content within a window.

Segmented Controls

A segmented control is a linear set of two or more segments, each of which functions as a button.

Sliders

Sliders allow users to make selections from a range of values.

Spinners

Spinners indicate progress by showing users a loading state.

Switches

Switches are used to toggle functionality.

Tables

Tables display information in a grid-like format of rows and columns.

Tabs

Tabs are used to quickly navigate between views within the same context.

Toasts

Toasts provide non-intrusive, short-lasting contextual feedback to the user.

Top Navbars

The top navbar provides context through globally accessible menu options.