AccordionaccordionExpandable disclosure sections for FAQs and settings, with single or multiple open modes and nested content support.
AlertalertInline status feedback for info, success, warning, and error states, including action-oriented messages with buttons.
Animated Tabsanimated-tabsA physical stack of photo cards shuffled to the front by clipped tabs, with a tight image inset and copy in the footer.
Aspect Ratioaspect-ratioMedia containers that hold preset ratios across responsive layouts, with a shimmer placeholder while images load.
AttachmentattachmentFile attachment rows for uploads, chats, and media previews, with download actions and per-type document icons.
AvataravatarIdentity avatars with image fallbacks, presence status rings, stacked groups, and an upload affordance for profile edits.
BadgebadgeStatus and metadata badges with icons, presence dots, removable chips, and just enough depth to read as a real surface.
Before After Cardbefore-after-cardDrag the handle to wipe between before and after images with absolutely zero lag.
BreadcrumbbreadcrumbA wayfinding trail with smart collapsing, dropdown overflow menus, custom separators, and animated hover states.
ButtonbuttonAn accessible action primitive with solid, outline, ghost, and destructive variants, plus sizes, icons, and loading state.
Button Groupbutton-groupA segmented action group with shared borders, split primary actions, and dropdown menu support for dense toolbars.
CalendarcalendarDate grids for single, range, and multi-date selection, with month navigation and event-ready day rendering.
Canvas Textcanvas-textLoading-ring canvas particles that slowly resolve into solid letterforms.
CardcardPremium content containers with media, stat, feature, and interactive variants, plus responsive spacing throughout.
CarouselcarouselSwipeable carousels with slide indicators, autoplay, looping, and keyboard navigation for galleries and showcases.
ChartchartRecharts line, bar, area, pie, and radar views with themed tooltips, responsive sizing, and consistent axis styling.
CheckboxcheckboxAn accessible checkbox with sharply focused styles, grouped rows, selectable cards, and a proper indeterminate state.
CollapsiblecollapsibleCollapsible panels for sidebar sections, show-more previews, and any secondary content you want out of the way.
ComboboxcomboboxA searchable combobox with multi-select, async option loading, and creatable entries for forms, filters, and pickers.
CommandcommandA command palette with fuzzy search, grouped actions, keyboard shortcuts, and fast navigation built on top of cmdk.
Context Menucontext-menuContextual actions on right-click, with grouped sections, nested submenus, shortcut labels, and destructive items.
Cool Buttoncool-buttonA dual-layer orbit glow that soft-spins around the edge of any button or link you wrap it around, at zero layout cost.
Data Tabledata-tableData tables with search, sorting, filtering, row selection, pagination, and expandable detail rows for dashboards.
Date Pickerdate-pickerCalendar popovers for single, range, and multi-date picks, with presets, time selection, and month or year quick-nav.
DialogdialogAccessible modal dialogs in default, confirmation, form, fullscreen, and scrollable layouts for any focused task.
DirectiondirectionLTR and RTL direction context for layout and composition, driving reading order from the active locale automatically.
DrawerdrawerGesture-driven drawers with velocity dismissal, snap points, drag handles, and support for every side of the screen.
Dropdown Menudropdown-menuCompact actions from any trigger, with grouped sections, nested submenus, checkbox and radio items, and shortcuts.
Empty Stateempty-stateEmpty layouts for placeholders, search results, and errors, with basic, action, illustration, and avatar variants.
FieldfieldA composable field shell carrying labels, help text, required markers, and error, success, and validation states.
File Uploaderfile-uploaderA bold red dropzone for any file, with gallery tiles and progress after upload.
Form Fieldform-fieldA composable field wrapper carrying labels, descriptions, inline errors, and section layouts for any form you assemble.
Generative Skeleton Meshgenerative-skeleton-meshAn organic loading state instead of a spinner, with a slow aurora that breathes in the space where your content will land.
GitHub-Style Activity Gridgithub-activity-grid365 squares sharing one tooltip that flies between days on rails, with a reveal that ripples backward from today.
Gooey Navigation Menugooey-navigation-menuA liquid FAB whose child actions stretch out of the trigger like molten metal.
Hover Cardhover-cardSnappy preview overlays triggered by hovering a link or name, with rich content and no click interruption at all.
Infinite Marqueeinfinite-marqueeA seamless, GPU-only logo strip that never stutters or snaps at the loop point.
InputinputAn accessible text field with labels, hints, inline errors, leading and trailing icons, and a one-tap clear action.
Input OTPinput-otpAn accessible one-time code field with alphanumeric, masked, and grouped variants for verification and two-factor flows.
KbdkbdKeyboard key styling for shortcuts, hotkey hints, documentation, and inline command labels anywhere in your app.
LabellabelAn accessible form label with default, required, optional, muted, and inline variants for any field group you build.
Line Fill Textline-fill-textAlpha-cascade ribbons clipped neatly inside the letterforms themselves.
Liquid Multimodal Inputliquid-multimodal-inputAn expanding prompt area with a glowing drop zone that breathes open to meet you as you type a thought or drag a file.
MarkermarkerStatus markers for live state, ordered points, and contextual cues, with solid dots and pulsing presence indicators.
Model Context Switchermodel-context-switcherA Radix dropdown that scales out from its trigger and glides the selection pill across to meet whichever model you pick.
Morphing Shape Backgroundmorphing-shape-backgroundLava-lamp blobs that drift behind your hero at 120fps with no SVG morphing.
Multi-Select Token Pillsmulti-select-token-pillsA tag input where pills pop in as you add them and slide out on remove, closing the gap without snapping the layout.
Native Selectnative-selectBrowser-native option selection for forms, with grouped options, placeholders, inline variants, and error states.
Navigation Menunavigation-menuPrimary navigation with dropdown panels, mega menus, nested links, and full keyboard accessibility for headers.
PaginationpaginationPage navigation with numbered pages, compact counters, first and last controls, and progressive loading for lists.
PopoverpopoverFloating panels for menus, inline forms, and rich previews, with controlled state and collision-aware positioning.
ProgressprogressProgress indicators in linear, circular, segmented, indeterminate, and stacked forms for uploads and onboarding.
Radio Groupradio-groupNative radio selection with distinctive rows, segmented layouts, selectable cards, and controlled state throughout.
ResizableresizableResizable panel layouts with draggable splitters, panel snapping, collapsible regions, and local size persistence.
Scroll Areascroll-areaA styled scrolling container with auto-hide scrollbars, keeping constrained panels, lists, and overflow regions tidy.
Scrubbable Video Revealscrubbable-video-revealAn Apple-style image sequence scrubbed frame by frame on canvas, following your hand as you scroll in either direction.
SelectselectAn accessible select with a polished trigger, grouped options, controlled state, and keyboard navigation throughout.
SeparatorseparatorDividers for layout sections, carrying text labels, gradient fades, dashed borders, and vertical split support.
SheetsheetEdge-mounted panels that slide in from any side, with an optional persistent mode for inspectors and navigation.
Shimmering Skeleton Wrappershimmering-skeleton-wrapperOne angled GPU sweep that travels across any placeholder geometry you wrap, never a separate shimmer stuttering per row.
SidebarsidebarApp sidebars with collapsible rails, grouped sections, badge counts, resizable widths, and keyboard shortcut support.
SkeletonskeletonLoading placeholders for text, avatars, cards, and tables, plus a wrapper for composing your own custom layouts.
SlidersliderAn accessible slider built on Base UI, with keyboard and pointer support and a value bubble that reveals on drag.
SpinnerspinnerIndeterminate loading indicators in default, ring, dots, pulse, and overlay styles for inline and blocking states.
SwitchswitchAn accessible switch with distinct variants, smooth motion, grouped rows, selectable cards, and fully controlled state.
TabletableA structured table with sortable columns, row selection, expandable rows, and sticky headers for dashboards and admin.
TabstabsTabbed navigation with a sliding indicator, segmented control styling, vertical layouts, and smooth state changes.
Text Areatext-areaAn accessible multi-line field with auto-resize, character counts, validation states, and variants for notes or prompts.
Text Blur Revealtext-blur-revealA blur-in stagger by word or by letter, triggered the moment you scroll.
Text Char Slidetext-char-slideA per-character slide-left cascade with a cleanly staggered entrance timing.
Text Chroma Revealtext-chroma-revealA chromatic ribbon sweep that paints each of your headlines cleanly into view.
Text Cycletext-cycleCycles through your headline words with a soft per-character blur stagger.
Text Fliptext-flipA 3D character flip on hover, staggered and springy across every single letter.
Text Glitchtext-glitchA chromatic clip-path glitch for headlines, CSS-only and entirely GPU-friendly.
Text Highlighttext-highlightA hand-placed highlighter band that sweeps in behind your text and tracks wrapping.
Text Morphingtext-morphingBlur-morphing headlines that cycle phrases with a gooey, seamless crossfade.
Text Motiontext-motionHeadline entrances driven entirely by your own custom Framer Motion variants.
Text Pathtext-pathSVG text riding a curved wave, arc, or circle path on a seamless, light loop.
Text Rippletext-rippleA 3D character ripple with a traveling color crest, CSS-only and GPU-light.
Text Scribbletext-scribbleHand-drawn scribble, underline, and strike marks that draw themselves onto text.
Text Shimmertext-shimmerA CSS shimmer sweep for headlines, one single element and entirely GPU-friendly.
Text Spectrumtext-spectrumAn animated multi-stop color wash that drifts endlessly through headlines.
Text Word Fliptext-word-flipSpring-loaded word flips paired with a soft letter-by-letter blur stagger.
ToasttoastTransient notifications for info, success, warning, and error states, with action buttons and stacked positioning.
ToggletoggleA pressable on/off control with default, icon, outline, and soft variants, plus grouped selection for toolbars.
TooltiptooltipContextual hints carrying rich content, keyboard shortcut labels, and optional cursor tracking as you move across.
TypographytypographyType primitives for headings, prose blocks, lead and muted text, inline code, and consistently styled lists.
Voice Aurora Wavevoice-aurora-waveA breathing voice orb that swells with speech and settles between turns, never jittery and always organic to look at.