Feedback & Status
Components that provide users with real-time feedback, status updates, or visual indicators.
Alert
Displays an important message with optional actions, typically used for feedback or system status.
Badge
Labels, categorizes, or indicates the status of an item using compact visual cues.
Loader
Indicates ongoing activity or system processing with a visual cue.
Navigation & Structure
Components that help users move through an interface and organize content logically.
Breadcrumbs
Pagination [Template]
Tabs [Template]
Navigation vertical [Template]
Navigation horizontal [Template]
Accordion
Actions & Controls
Components that trigger user actions, whether standalone or grouped.
Button
Triggers an action and visually communicates interactivity and importance.
IconButton
Triggers an action and visually communicates interactivity and importance.
Buttongroup
Menu
Displays a list of options or actions triggered by a user interaction.
Form Elements
Components that allow users to input, select, or modify data.
Text inputs
For entering and modifying textual data.
Selection Controls
For choosing options from predefined sets.
Checkbox
Radio
Toggle
Dropdown
Opens a panel with selectable options or actions when triggered.
Select
Lets users choose a single value from a predefined list.
Multi select
Enables users to choose multiple values from a predefined list of options.
Numeric & Date Inputs
For handling numerical or time-based data.
Calendar
Enables users to view, navigate and select dates interactively with support for multiple formats.
Date
A single date input for clear and consistent date selection.
Daterange
Number
Lets users enter and adjust numeric values using input or controls.
Time
Lets users select a specific time value from a formatted list.
Overlays & Dialogs
Components that appear above the main interface to provide additional information or interactions.
Dialog
Presents focused content in a modal overlay that requires user interaction before continuing.
Popover
A panel that slides into view from the edge of the screen to display contextual content without blocking the full page experience.
Tooltip
Offers brief, contextual information on hover or focus.
Data Display
Components that present structured data or content.
Identity & Icons
Visual elements representing users, icons, or branding.
Avatar
Represents a user using their profile image, initials or an icon.
Icons
Represents actions, objects or states using a compact visual symbol.