The core of modern interfaces.

Buttons, inputs, selection controls, and layout pieces live here so the main components catalog stays focused.

Create Preset

Create your design system.

Open

Accordion

Expandable disclosure sections for FAQs and settings, with single or multiple open modes and nested content support.

Alert

Inline status feedback for info, success, warning, and error states, including action-oriented messages with buttons.

Aspect Ratio

Media containers that hold preset ratios across responsive layouts, with a shimmer placeholder while images load.

Attachment

File attachment rows for uploads, chats, and media previews, with download actions and per-type document icons.

Avatar

Identity avatars with image fallbacks, presence status rings, stacked groups, and an upload affordance for profile edits.

Badge

Status and metadata badges with icons, presence dots, removable chips, and just enough depth to read as a real surface.

Breadcrumb

A wayfinding trail with smart collapsing, dropdown overflow menus, custom separators, and animated hover states.

Button

An accessible action primitive with solid, outline, ghost, and destructive variants, plus sizes, icons, and loading state.

Button Group

A segmented action group with shared borders, split primary actions, and dropdown menu support for dense toolbars.

Calendar

Date grids for single, range, and multi-date selection, with month navigation and event-ready day rendering.

Card

Premium content containers with media, stat, feature, and interactive variants, plus responsive spacing throughout.

Carousel

Swipeable carousels with slide indicators, autoplay, looping, and keyboard navigation for galleries and showcases.

Chart

Recharts line, bar, area, pie, and radar views with themed tooltips, responsive sizing, and consistent axis styling.

Checkbox

An accessible checkbox with sharply focused styles, grouped rows, selectable cards, and a proper indeterminate state.

Collapsible

Collapsible panels for sidebar sections, show-more previews, and any secondary content you want out of the way.

Combobox

A searchable combobox with multi-select, async option loading, and creatable entries for forms, filters, and pickers.

Command

A command palette with fuzzy search, grouped actions, keyboard shortcuts, and fast navigation built on top of cmdk.

Context Menu

Contextual actions on right-click, with grouped sections, nested submenus, shortcut labels, and destructive items.

Data Table

Data tables with search, sorting, filtering, row selection, pagination, and expandable detail rows for dashboards.

Date Picker

Calendar popovers for single, range, and multi-date picks, with presets, time selection, and month or year quick-nav.

Dialog

Accessible modal dialogs in default, confirmation, form, fullscreen, and scrollable layouts for any focused task.

Direction

LTR and RTL direction context for layout and composition, driving reading order from the active locale automatically.

Drawer

Gesture-driven drawers with velocity dismissal, snap points, drag handles, and support for every side of the screen.

Dropdown Menu

Compact actions from any trigger, with grouped sections, nested submenus, checkbox and radio items, and shortcuts.

Empty State

Empty layouts for placeholders, search results, and errors, with basic, action, illustration, and avatar variants.

Field

A composable field shell carrying labels, help text, required markers, and error, success, and validation states.

Form Field

A composable field wrapper carrying labels, descriptions, inline errors, and section layouts for any form you assemble.

Hover Card

Snappy preview overlays triggered by hovering a link or name, with rich content and no click interruption at all.

Input

An accessible text field with labels, hints, inline errors, leading and trailing icons, and a one-tap clear action.

Input OTP

An accessible one-time code field with alphanumeric, masked, and grouped variants for verification and two-factor flows.

Kbd

Keyboard key styling for shortcuts, hotkey hints, documentation, and inline command labels anywhere in your app.

Label

An accessible form label with default, required, optional, muted, and inline variants for any field group you build.

Marker

Status markers for live state, ordered points, and contextual cues, with solid dots and pulsing presence indicators.

Native Select

Browser-native option selection for forms, with grouped options, placeholders, inline variants, and error states.

Navigation Menu

Primary navigation with dropdown panels, mega menus, nested links, and full keyboard accessibility for headers.

Pagination

Page navigation with numbered pages, compact counters, first and last controls, and progressive loading for lists.

Popover

Floating panels for menus, inline forms, and rich previews, with controlled state and collision-aware positioning.

Progress

Progress indicators in linear, circular, segmented, indeterminate, and stacked forms for uploads and onboarding.

Radio Group

Native radio selection with distinctive rows, segmented layouts, selectable cards, and controlled state throughout.

Resizable

Resizable panel layouts with draggable splitters, panel snapping, collapsible regions, and local size persistence.

Scroll Area

A styled scrolling container with auto-hide scrollbars, keeping constrained panels, lists, and overflow regions tidy.

Select

An accessible select with a polished trigger, grouped options, controlled state, and keyboard navigation throughout.

Separator

Dividers for layout sections, carrying text labels, gradient fades, dashed borders, and vertical split support.

Sheet

Edge-mounted panels that slide in from any side, with an optional persistent mode for inspectors and navigation.

Sidebar

App sidebars with collapsible rails, grouped sections, badge counts, resizable widths, and keyboard shortcut support.

Skeleton

Loading placeholders for text, avatars, cards, and tables, plus a wrapper for composing your own custom layouts.

Slider

An accessible slider built on Base UI, with keyboard and pointer support and a value bubble that reveals on drag.

Spinner

Indeterminate loading indicators in default, ring, dots, pulse, and overlay styles for inline and blocking states.

Switch

An accessible switch with distinct variants, smooth motion, grouped rows, selectable cards, and fully controlled state.

Table

A structured table with sortable columns, row selection, expandable rows, and sticky headers for dashboards and admin.

Tabs

Tabbed navigation with a sliding indicator, segmented control styling, vertical layouts, and smooth state changes.

Text Area

An accessible multi-line field with auto-resize, character counts, validation states, and variants for notes or prompts.

Toast

Transient notifications for info, success, warning, and error states, with action buttons and stacked positioning.

Toggle

A pressable on/off control with default, icon, outline, and soft variants, plus grouped selection for toolbars.

Tooltip

Contextual hints carrying rich content, keyboard shortcut labels, and optional cursor tracking as you move across.

Typography

Type primitives for headings, prose blocks, lead and muted text, inline code, and consistently styled lists.