Primitives
Every SevenUI primitive, built on Base UI and installed into your project as source code through the shadcn CLI.
Accordion
A vertically stacked set of interactive headings that each reveal an associated panel of content, built on the Base UI Accordion primitive.
Alert
Displays a message with optional title and description for the user.
Alert Dialog
A modal dialog that interrupts the user with important content and expects a response, built on the Base UI Alert Dialog primitive.
Aspect Ratio
Displays content with a fixed aspect ratio.
Attachment
Displays file attachments with media previews and actions.
Avatar
An image element with a fallback for representing the user.
Badge
Displays a small status descriptor.
Breadcrumb
Displays the current location within a hierarchical navigation structure.
Bubble
Chat message bubbles for conversational interfaces.
Button
Displays a button built on the Base UI Button primitive.
Button Group
Groups related buttons with shared borders and separators.
Calendar
A date field primitive that lets users select dates or ranges.
Card
Displays a container with optional header, content, and footer sections.
Carousel
A carousel with motion and swipe built using Embla.
Chart
Composable chart primitives built on Recharts.
Checkbox
Displays a checkbox built on the Base UI Checkbox primitive.
Collapsible
An interactive primitive which expands/collapses a panel, built on the Base UI Collapsible.
Combobox
An input combined with a filterable popup list, built on the Base UI Combobox primitive.
Command
A fast, composable command palette built on the Base UI Autocomplete primitive.
Context Menu
Displays a menu to the user — such as a set of actions or functions — triggered by right click or touch long-press, built on the Base UI Menu primitive.
Dialog
A window overlaid on either the primary window or another dialog window, rendering the content underneath inert, built on the Base UI Dialog primitive.
Direction
Re-exports the Base UI DirectionProvider for RTL support.
Drawer
A panel that slides in from an edge of the screen and can be dismissed with a swipe gesture, built on the Base UI Drawer primitive.
Dropdown Menu
Displays a menu to the user — such as a set of actions or functions — triggered by a button, built on the Base UI Menu primitive.
Empty
Displays an empty state with media, title, description, and actions.
Field
Associates a label, control, description, and validation error for a form field.
Form
A native form with consolidated, auto-clearing validation error handling.
Hover Card
Displays a preview card when hovering or focusing a link, built on the Base UI Preview Card primitive.
Input
Displays a text input built on the Base UI Input primitive.
Input Group
Groups an input with addons, buttons, and inline text.
Input OTP
Displays an OTP input field built on the Base UI OTPField primitive.
Item
A flexible list item with media, content, and actions.
Kbd
Displays a keyboard key.
Label
Displays a label for form inputs.
Marker
An inline marker with icon and content for annotating UI.
Menubar
A horizontal menu bar with multiple menus — such as File, Edit, and View — built on the Base UI Menu primitive.
Message
Chat message layout with avatar, content, header, and footer.
Message Scroller
Auto-scrolling chat viewport built on the shadcn MessageScroller primitive.
Meter
Displays a value within a known range, built on the Base UI Meter primitive.
Native Select
A styled native HTML select element.
Navigation Menu
A collection of links for navigating websites, sharing one animated popup between top-level menu triggers, built on the Base UI Navigation Menu primitive.
Number Field
Displays a number field built on the Base UI Number Field primitive.
Pagination
Displays navigation for multi-page content.
Popover
Displays rich content in a portal, positioned relative to an anchor element, built on the Base UI Popover primitive.
Progress
Displays an indicator showing the completion progress of a task.
Questionnaire
Multi-step questionnaire flow built on the shadcn Questionnaire primitive.
Radio Group
Displays a radio group built on the Base UI Radio primitive.
Resizable
Accessible resizable panel groups and layouts.
Scroll Area
Augments native scroll functionality for custom, cross-browser styling, built on the Base UI Scroll Area primitive.
Select
Displays a select menu built on the Base UI Select primitive.
Separator
Visually or semantically separates content.
Sheet
An edge-positioned panel that slides in from the side of the screen, built on the Base UI Dialog primitive.
Sidebar
A composable, themeable sidebar with collapsible, mobile, and icon-only modes.
Skeleton
Use to show a placeholder while content is loading.
Slider
Displays a slider built on the Base UI Slider primitive.
Spinner
Displays a loading indicator.
Switch
Displays a switch built on the Base UI Switch primitive.
Table
Displays data in rows and columns with semantic HTML and support for headers, bodies, and footers.
Tabs
A set of layered sections of content — known as tab panels — that display one panel at a time, built on the Base UI Tabs primitive.
Textarea
Displays a multi-line text input field.
Toast
Stacked, swipe-dismissable notifications driven by the Base UI toast manager.
Toggle
Displays a toggle built on the Base UI Toggle primitive.
Toggle Group
Displays a toggle group built on the Base UI Toggle Group primitive.
Toolbar
A container for grouping a set of controls, such as buttons, toggle groups, or links, built on the Base UI Toolbar primitive.
Tooltip
A popup that displays information related to an element when hovered or focused, built on the Base UI Tooltip primitive.