Components

Accordion

Expandable sections with animated height transition.

Card

Surface container for grouping related content.

Collapsible

Toggle visibility of any content with smooth animation.

Divider

Horizontal or vertical separator with optional label.

Tabs

Switch between views within the same context.

Breadcrumb

Shows the current page location within the hierarchy.

Nav

Sidebar navigation with sections, groups, and badges.

Navbar

Top-bar navigation with brand, links, and mobile menu.

Pagination

Page controls for navigating large datasets.

Stepper

Multi-step progress indicator for wizards and flows.

Button

Triggers an action or event.

Form Field

Wires label, input, hint, and error into one accessible unit.

Checkbox

Boolean selection input with indeterminate support.

Chip

Compact filter or selection pill.

Combobox

Searchable select with grouped options.

Copy Button

One-click clipboard copy with confirmation state.

Date Picker

Calendar popover for selecting a single date.

Date Range Picker

Calendar popover for selecting a start and end date.

Dropzone

Drag-and-drop file upload area.

Input

Text input with addons, icons, and clear button.

Number Input

Numeric input with increment and decrement controls.

Radio

Single-choice selection within a group.

Segmented Control

Button group for switching between mutually exclusive views.

Select

Native-feeling dropdown for picking one option.

Slider

Drag control for selecting a value within a range.

Switch

Toggle between on and off states.

Tag Input

Multi-value input for creating and removing tags.

Textarea

Multi-line text input with optional character count.

Alert Dialog

Modal confirmation for irreversible or destructive actions.

Command

Keyboard-first command palette for searching and navigation.

Context Menu

Right-click contextual action menu.

Dialog

Focused modal panel for forms and detail views.

Drawer

Side panel that slides in from any edge.

Dropdown

Positioned action menu triggered by a button.

Popover

Floating panel anchored to a trigger element.

Tooltip

Short label revealed on hover or focus.

Alert

Inline status message for info, success, warning, or error.

Progress

Linear bar showing completion percentage.

Skeleton

Loading placeholder that mimics content shape.

Spinner

Circular loading indicator.

Toast

Ephemeral notification that appears in a viewport corner.

Avatar

User or entity image with fallback and presence status.

Badge

Compact label for status, category, or count.

DataTable

Sortable, filterable table with pagination and row selection.

Empty State

Zero-content placeholder with icon, message, and action.

Kbd

Keyboard shortcut label.

List

Stacked rows — settings, activity, inbox, files.

Stat

KPI card with value, label, and trend indicator.

Table

Semantic HTML table with sort and zebra-stripe support.

Timeline

Chronological activity feed or audit log.