AccordionStacked headings that each reveal a panel, with height motion you can reverse mid-way and panels that stay searchable while closed.
AlertInline messages for status and feedback, with a neutral surface, a colored icon and a dismiss that collapses smoothly.
Alert dialogalert-dialogA confirmation dialog for destructive or important actions that waits for async work, and becomes a bottom sheet on phones.
Aspect ratioaspect-ratioA box that holds its shape before media loads, shimmers while loading, fades the media in and falls back when it fails.
AttachmentFile and image cards for uploads, with progress, states, actions, a full-card trigger and names that keep their extension.
AvatarUser photos with an initials fallback, status badges and stacked groups that collapse into a count.
BadgeStatus labels with colored dots, removable tags that slide closed and counts that roll to their new value.
BreadcrumbA trail of links to the current page that wraps safely, mirrors in right-to-left layouts and expands collapsed segments in place.
BubbleChat message bubbles with variants, grouped corners, reactions and room for interactive content.
ButtonButtons in every variant and size, with a built-in loading, success and error flow that skips the spinner for fast requests.
Button groupbutton-groupButtons joined into one control, with shared seams, separators, text addons, nesting and vertical stacks.
CalendarA date grid for single, range and multiple selection, with sliding months, range previews and touch-sized days.
CardA surface for grouping content, with three variants, edge-to-edge media, concentric radii and whole-card links.
CarouselNative scroll-snap slides with momentum on touch, mouse dragging, arrow keys, dots, thumbnails and an autoplay that pauses when it should.
ChartRecharts charts with themed colors, a tooltip and legend that read labels from one config, and keyboard navigation with a visible focus ring.
CheckboxA checkbox whose check draws in, with indeterminate parents, groups and labels that share its hover.
CollapsibleA panel that shows and hides with height motion you can reverse mid-way, without jumping the layout.
ComboboxA filterable select with chips, groups and async results, in a popup that resizes as you type.
CommandA searchable list of actions, inline or as a ⌘K palette, with pages, shortcuts and highlighted matches.
Context menucontext-menuA menu of actions on right click or long press, with submenus, checkbox and radio items, and hold feedback on touch.
Data tabledata-tableA table for real data, with sorting, search, row selection, pinned columns, a sticky header and pagination.
Date pickerdate-pickerA button that opens a calendar in a popover, or a bottom sheet on phones, for single dates and ranges.
DialogA window over the page for forms and focused tasks, with a pinned header and footer, nesting, and a swipeable bottom sheet on phones.
DrawerA panel that slides in from any edge and follows your finger, with snap points, a working handle and nested drawers that stack.
Dropdown menudropdown-menuA menu of actions and options behind a button, with groups, submenus, checkbox and radio items, and shortcuts.
EmptyA placeholder for screens with nothing to show yet, with an icon, a message and the next action.
FieldLabels, descriptions and errors wired to their control, with validation states and layouts for forms.
Hover cardhover-cardA preview card that opens when a link is hovered or focused, for content sighted users can glance at.
InputA text input with three sizes, invalid and read-only states, native validation styling and a 16px touch font so phones never zoom in.
Input groupinput-groupAn input with icons, text, buttons or a keyboard hint attached, sharing one border and focus ring.
Input OTPinput-otpOne-time code slots that take typing, paste and SMS autofill, with an opt-in animation that cascades codes in and a status for verifying.
ItemA row of media, text and actions for lists, settings and pickers, with a grouped surface and a hover highlight that glides between rows.
KbdKey caps for shortcuts that show the right symbols on every platform, read them out properly and press down with the real keys.
LabelA label that follows its control, dimming when it's disabled and marking it required or optional on its own.
MarkerQuiet notes between content, like date dividers and system events, with sticky dates and times that read as Today or Yesterday.
MenubarA desktop-style bar of menus with one highlight that slides between open menus and instant switching as you sweep across.
MessageA chat message row with an avatar, name, bubbles and status, where new messages rise in from the sender's side.
Message scrollermessage-scrollerA chat scroll area that follows new messages, keeps your place while you read back, and counts what you missed on the jump button.
Native selectnative-selectThe browser's own select, styled to match Input, with a quiet placeholder, Field support and the OS picker on every device.
Navigation menunavigation-menuSite navigation with dropdowns, or one full-width panel that stays open while its content slides between menus.
Number flownumber-flowAnimated numbers where only the changed digits spin, with any Intl format and locale.
PaginationPage navigation that keeps every button in place, glides to the current page and jumps to any page from the ellipsis.
PopoverA floating panel anchored to a trigger that resizes smoothly with its content and follows the trigger’s direction.
ProgressA bar or ring that shows how far a task has come, eases between updates and slides while the total is unknown.
QuestionnaireA step-by-step form that moves between questions with a sense of direction, shows real progress and answers from the keyboard.
Radio groupradio-groupPick one option from a set, with a dot that hands off between choices and cards whose selection ring slides to the new pick.
ResizablePanels you can drag apart, with a quiet divider that wakes up on hover, sizes that glide on reset or collapse, and layouts that persist.
Safe areasafe-areaA pointer safe triangle that keeps submenus and flyouts open while the cursor travels diagonally toward them.
Scroll areascroll-areaNative scrolling with a minimal scrollbar, edges that fade only where there’s more to see, and an optional peek that cuts the last item in half.
SelectPick one or more options from a list that opens on the current value, with typeahead, groups and form support.
SeparatorA hairline that divides content horizontally or vertically, with an optional label and a decorative mode for purely visual lines.
SheetA panel that slides in from any edge, with swipe-to-dismiss, scroll lock and stacked nesting.
SidebarAn app sidebar that collapses to icons or off canvas, stays pinned under your header, and becomes a swipeable sheet on phones.
SkeletonPlaceholders that wait 150ms before showing, take the exact size of the content they wrap, and fade it in without moving anything.
SliderPick a value or a range by dragging, tapping the track or using the keys, with jumps that glide and an optional value bubble.
SpinnerA loading indicator with Apple-style ticks or a breathing ring that can wait before showing and stay long enough not to flicker.
SwitchAn on/off toggle you can tap, press or drag, with a thumb that stretches under your finger and an optional pending state for saves.
TableA responsive table with a surface style, wrapping or compact cells, sticky headers, pinned columns and scroll hints.
TabsSwitch between views with an indicator that slides to the active tab, as a segmented control or an underline, and lists that scroll when they overflow.
TextareaMulti-line text that grows smoothly with what you write between a minimum and maximum number of rows, with counters, validation and a submit shortcut.
ToastBrief messages that stack neatly, expand on hover, swipe away, and turn a loading state into success or error in place.
ToggleA button that stays on or off, with a fill that settles in when pressed, a clear hover-to-on step and icons that can fill with the state.
Toggle grouptoggle-groupA row of toggles for one choice or many, with a fill that slides to the picked item, joined or spaced items and arrow-key focus.
TooltipA short hint on hover or keyboard focus that opens after a brief rest, switches instantly between neighbours and shows shortcuts.
TreeNested, expandable rows for files and hierarchies, with indent guides, connector lines, cascading checkboxes, typeahead and full keyboard support.
Video playervideo-playerA video player with a scrubbable seek bar, auto-hiding controls, keyboard shortcuts, speed, picture in picture and full screen.