---
outline: deep
---
# Components
Collapsible content container that organizes related information into expandable panels.
Contextual message for communicating status, warnings, or important information.
Visual representation of a user or entity, displayed as an image, icon, or fallback initials.
Compact indicator used to highlight numeric values, statuses, or labels.
Navigational trail showing the current page's location within the site hierarchy.
Chat message bubble with alignment, semantic variants, attachment previews, and reactions.
Interactive control for triggering actions, available in multiple semantic style variants.
Container that visually groups related buttons into a single, cohesive control.
Flexible content container designed to present grouped information.
Slideshow that cycles through slides with controls, indicators, keyboard nav, and optional autoplay.
Standard selection control for multi-option forms and interfaces.
Compact, interactive element representing a filter or selection, with an optional dismiss button.
Full event calendar with month, week, day, and year views.
Compact monthly calendar for selecting a single date or a date range.
User-friendly control for picking dates from a calendar.
Combined control for selecting a date and time together within a single popover.
Text input paired with a popup for selecting a month and year.
Inline calendar showing consecutive days with a grid of selectable time slots.
Text input paired with a popup panel for selecting hours, minutes, and seconds.
Text input paired with a month calendar for selecting a whole ISO week.
Modal interface for focused user interactions such as confirmations, forms, and alerts.
Container for toggling the visibility of a section of content with a clickable header.
Structural grouping element for associating related form controls with a legend.
Input for choosing one or more files, showing the selected files as tags inside the field.
Renders built-in or custom SVG icons with accessible role and label support.
Structured layout for presenting help content or informational panels.
Single-line text field for capturing user input in forms.
Composite input container that combines text fields with addons or buttons.
Input container that combines a number field with increase and decrease buttons.
Descriptive text element that enhances form accessibility.
Vertically arranged collection of items for displaying related data.
Selectable list interface supporting single or multiple item selection.
Context, navigation or dropdown menu for presenting action lists and nested options.
Horizontal bar of always-visible command menus, like the File and Edit menus of desktop applications.
Horizontal navigation bar with direct links and dropdown menus for top-level site navigation.
Displays system feedback, status updates, or alerts as toast-style or inline notifications.
Navigational control for traversing multi-page or segmented content.
Floating container for supplemental content or contextual actions anchored to an element.
Visual indicator that communicates task completion or load progression.
Mutually exclusive input control for selecting one option from several.
Slider control for selecting a numeric value by dragging a thumb along a track.
Star-based control for viewing and setting a subjective score, with half-star precision.
Dropdown component for choosing options from a list with search support.
Simple visual divider used to organize content into logical sections.
Slide-over panel that presents additional navigation or tools without disrupting context.
Fixed or collapsible navigation container for application menus and quick links.
Placeholder loading state that improves perceived performance during content fetches.
Dynamic loader graphic signaling ongoing activity or processing.
Sequential progress tracker highlighting completed, active, and upcoming steps.
Toggle control designed for binary on/off state selection.
Styled component for displaying structured data in rows and columns with a clear visual hierarchy.
Navigation control that switches between panels of related content using tab buttons.
Concise label for categorization, keywords, or key indicators.
Applies consistent typographic styles for headings, paragraphs, code blocks, and other text elements.
Multiline text input field optimized for longer user content.
Clickable or informational block combining an image, title, and supporting content.
Grouped action bar providing quick access to common commands.
Small floating label that appears on hover to provide context or clarify a UI element.
Structured list component designed to represent hierarchical relationships.