Buttons are used to initialise actions.
Button groups organise multiple buttons logically, so users can take action easily.
Floating buttons are persistent buttons that sit in front of all content.
Accordions are lists of headers that can collapse or expand to show more information.
Avatars are visual representations of users or entities.
Badges are read-only notification indicators and are non-interactive.
Cards present bite-sized information using text, images, icons, or other elements in a digestible way.
Carousels show multiple pieces of content in sequence.
Lists organise multiple related items in a sequential format.
A list item is a single entry within a list.
Status indicators help users assess the status of the message and respond accordingly.
Tables organise information in rows and columns.
Tags are non-actionable labels that identify the attributes of interface elements.
Tooltips provide short, contextual information upon user interaction.
Activity indicators communicate the status of ongoing processes and system response to user action.
Dialogs appear in front of existing content to present important information or ask for user input.
Empty states indicate that there's no content, data, results, or history available to be displayed.
Page-level messages present important information for users to understand the context and take action.
Skeleton loader is an animated state that visually indicates the component or page is loading.
Snackbars are non-modal, time-based elements used to display short messages.
System alerts are messages that inform users about system statuses, updates, or settings.
Checkboxes allow multiple selections in a list.
Chips allow users to select or filter items based on their descriptive tags.
Date pickers allow the selection of a date or a month, including past, present, and future dates.
Dropdowns allow single or multiple selections from a list of options.
Inputs allow users to enter single-line, free-form data, usually in a form or dialog.
Radios enable users to select a single option from a list of mutually exclusive choices.
The rating component allows users to rate their experience or preference on a scale.
Sliders are sliding scales that allow users to select a value or range.
Switches are used to toggle between 2 possible states.
Textareas allow users to enter multiple lines of free-form text or data input.
Uploaders allow users to add one or more files as part of a form or as a standalone field.
Value steppers are controls used to increase or decrease the value.
Breadcrumbs are a navigation pattern that helps users understand where they are in the site structure.
Paginations show how many pages there are and help users navigate between them.
Tabs organise related content that are at the same level of hierarchy.