Components are one of the key building blocks of the design system. Each component meets a specific interaction or UI need, and help to create visual and functional consistency across products.
Button
Buttons communicate possible user actions. Clicking on a button allows a user to perform the corresponding action.
Card
The card is a wrapper that displays content and actions on a single topic. It helps us structure the information that a user needs to digest.
Icon
The Icon component allows you to display an icon from the Iconography library. They are used to provide additional meaning or give a hint about the usability of the component they are used in.
Icon Button
The Icon Button communicate possible user actions. Clicking on a button allows a user to perform the corresponding action. Icon buttons are suited for common, easily recognizable actions that don't require labels.
Link
Links are text-based interactive elements used to navigate users to external sites outside the app. They can be used inline or as standalone text.
Segmented control
Segmented Control is a group of connected controls that enables users to select one or more related options to switch context or filter content without leaving the current screen.
Tile
A Tile is a flexible container that groups related content and actions in a clear, interactive format. It can function as a selectable or clickable element, enabling navigation, quick actions, or option selection.