All Components
A comprehensive list of all available components in the Aura Design System.
All Components
Here is a complete list of all available components in the Aura Design System:
Accordion
A vertically stacked set of interactive headings that each reveal a section of content.
Action Bar
A floating toolbar for bulk actions on selected items.
Alert
Displays a callout for user attention with contextual feedback messages.
Alert Dialog
A modal dialog that interrupts the user with important content and expects a response.
Angle Slider
A circular slider for selecting an angle or value along an arc.
Aspect Ratio
Displays content within a desired ratio.
Autocomplete
A input component that allows users to search and select from a list of options.
Avatar
An image element with a fallback for representing the user.
Avatar Group
Overlapping avatars with truncation, orientation, and custom overflow.
Badge
Displays a badge or a component that looks like a badge.
Badge Overflow
Measures available space and shows badges with an overflow indicator.
Bubble
Displays conversational content in a message bubble. Supports variants, alignment, grouping, reactions, and polymorphic content.
Button
Displays a button or a component that looks like a button.
Button Group
A container that groups buttons (and optional text or separators) with shared styling and orientation.
Calendar
Displays a calendar.
Card
Displays a card with header, content, and footer sections.
Carousel
A carousel component built with Embla, with optional previous/next controls and configurable orientation.
Checkbox
A control that allows the user to toggle between checked and not checked.
Collapsible
An interactive component which expands and collapses content.
Combobox
A combobox component that allows users to search and select from a list of options.
Command
A command palette that allows users to search and execute commands.
Context Menu
Displays a menu to the user triggered by right-click or long-press.
Dialog
A window overlaid on the primary content, rendering content in a layer above the page.
Drawer
A drawer component that slides in from the edge of the screen.
Dropdown Menu
Displays a menu of actions or options triggered by a button.
Editable
Inline text that switches between preview and edit modes.
Empty
A placeholder component for empty states, with optional icon, title, description, and content slots.
File Upload
A composable file upload with dropzone, list, previews, and progress indicators.
Form
A comprehensive form system with schema-based validation, error handling, and field management. Built with Radix UI primitives and AJV validation, supporting text inputs, textareas, selects, checkboxes, switches, and checkbox groups with automatic error propagation and touch state management.
Grid
Displays a grid container with configurable column layout.
Hover Card
For sighted users to preview content available behind a link.
Input
Displays a form input field or a component that looks like an input field.
Input Group
Add addons, buttons, and helper content to inputs.
Kbd
A keyboard shortcut component that allows users to display keyboard shortcuts.
Label
Renders an accessible label associated with form controls.
Marker
Displays an inline status, system note, bordered row, or labeled separator in a conversation.
Mask Input
An input that formats values with built-in or custom mask patterns.
Mention
An accessible text input that suggests and inserts items after a trigger character.
Menubar
A visually persistent menu common in desktop applications.
Message
Displays a message in a conversation, with optional avatar, header, footer, and alignment.
Message Scroller
A chat scroll container that anchors turns, follows streamed output, loads history without jumping, and jumps to any message.
Navigation Menu
A collection of links for navigating websites.
Pagination
Pagination with page links, previous/next controls, and ellipsis.
Popover
Displays rich content in a portal triggered by a button.
Presentation
Composable PowerPoint viewer and editor built on @diceui/pptx.
Progress
Displays an indicator showing the completion progress of a task.
Radio Group
Re-usable components built using Radix UI and Tailwind CSS.
Responsive Dialog
A dialog on desktop and a drawer on mobile, sharing one API.
Responsive Dropdown Menu
A dropdown menu on desktop and a stacked drawer for nested menus on mobile.
Scroll Area
Augments native scroll functionality for custom cross-browser styling.
Section
A semantic section container with configurable layout variants.
Segmented Input
A group of connected input fields that appear as a single segmented visual unit.
Select
A select component that allows users to select a value from a list of options.
Selection Toolbar
A floating toolbar that appears on text selection with formatting and utility actions.
Separator
A separator component that allows users to separate content.
Sheet
A slide-out panel that overlays the page, with optional header, footer, title, and description. Opens from a trigger (e.g. button).
Sidebar
A collapsible side panel for app navigation and layout, with optional mobile sheet, icons, and persistent state.
Signature Pad
A component that allows the user to sign a document using a pen.
Skeleton
A loading placeholder with pulse animation, typically used for content that is being fetched.
Slider
An input where the user selects a value from within a given range.
Sortable
A sortable list of items.
Stat
Displays a statistic with label, value, optional indicator, trend, and description.
Stepper
A sequential progress indicator with navigation controls.
Switch
A control that allows the user to toggle between on and off states.
Table
Re-usable components built using Radix UI and Tailwind CSS.
Tabs
A tabs component that allows the user to switch between different views.
Textarea
Re-usable components built using Radix UI and Tailwind CSS.
Toggle
A toggle component that allows the user to toggle between on and off states.
Toggle Group
A group of toggle buttons where one or more options can be selected, with single or multiple selection modes.
Tooltip
A tooltip component that displays informative text when hovering over an element.
Visually Hidden Input
A visually hidden input that mirrors a control for form submission.