@sevenui
Base UI powered components, distributed through the shadcn registry.
Install this registry
npx shadcn@latest add https://sevenui.dev/r/registry.json pnpm dlx shadcn@latest add https://sevenui.dev/r/registry.json bunx shadcn@latest add https://sevenui.dev/r/registry.json curl -s https://sevenui.dev/r/registry.json Components
67 totalshadcn-compatible design tokens (neutral palette).
npx shadcn@latest add https://sevenui.dev/r/theme.json SevenUI's enter/exit animation utilities (animate-in/out, fade, zoom, slide) used by the overlay components.
npx shadcn@latest add https://sevenui.dev/r/animations.json Displays a button built on the Base UI Button primitive.
npx shadcn@latest add https://sevenui.dev/r/button.json Displays a small status descriptor.
npx shadcn@latest add https://sevenui.dev/r/badge.json Displays a keyboard key.
npx shadcn@latest add https://sevenui.dev/r/kbd.json Displays a label for form inputs.
npx shadcn@latest add https://sevenui.dev/r/label.json Displays a container with optional header, content, and footer sections.
npx shadcn@latest add https://sevenui.dev/r/card.json Displays a text input built on the Base UI Input primitive.
npx shadcn@latest add https://sevenui.dev/r/input.json Displays an OTP input field built on the Base UI OTPField primitive.
npx shadcn@latest add https://sevenui.dev/r/input-otp.json Displays a message with optional title and description for the user.
npx shadcn@latest add https://sevenui.dev/r/alert.json An image element with a fallback for representing the user.
npx shadcn@latest add https://sevenui.dev/r/avatar.json Visually or semantically separates content.
npx shadcn@latest add https://sevenui.dev/r/separator.json Use to show a placeholder while content is loading.
npx shadcn@latest add https://sevenui.dev/r/skeleton.json Displays a loading indicator.
npx shadcn@latest add https://sevenui.dev/r/spinner.json Displays content with a fixed aspect ratio.
npx shadcn@latest add https://sevenui.dev/r/aspect-ratio.json Displays a multi-line text input field.
npx shadcn@latest add https://sevenui.dev/r/textarea.json Displays data in rows and columns with semantic HTML and support for headers, bodies, and footers.
npx shadcn@latest add https://sevenui.dev/r/table.json Displays the current location within a hierarchical navigation structure.
npx shadcn@latest add https://sevenui.dev/r/breadcrumb.json Displays navigation for multi-page content.
npx shadcn@latest add https://sevenui.dev/r/pagination.json Displays an indicator showing the completion progress of a task.
npx shadcn@latest add https://sevenui.dev/r/progress.json Associates a label, control, description, and validation error for a form field.
npx shadcn@latest add https://sevenui.dev/r/field.json A native form with consolidated, auto-clearing validation error handling.
npx shadcn@latest add https://sevenui.dev/r/form.json Displays a checkbox built on the Base UI Checkbox primitive.
npx shadcn@latest add https://sevenui.dev/r/checkbox.json Displays a radio group built on the Base UI Radio primitive.
npx shadcn@latest add https://sevenui.dev/r/radio-group.json Displays a switch built on the Base UI Switch primitive.
npx shadcn@latest add https://sevenui.dev/r/switch.json Displays a toggle built on the Base UI Toggle primitive.
npx shadcn@latest add https://sevenui.dev/r/toggle.json Displays a toggle group built on the Base UI Toggle Group primitive.
npx shadcn@latest add https://sevenui.dev/r/toggle-group.json Displays a slider built on the Base UI Slider primitive.
npx shadcn@latest add https://sevenui.dev/r/slider.json Displays a number field built on the Base UI Number Field primitive.
npx shadcn@latest add https://sevenui.dev/r/number-field.json Displays a select menu built on the Base UI Select primitive.
npx shadcn@latest add https://sevenui.dev/r/select.json An input combined with a filterable popup list, built on the Base UI Combobox primitive.
npx shadcn@latest add https://sevenui.dev/r/combobox.json A popup that displays information related to an element when hovered or focused, built on the Base UI Tooltip primitive.
npx shadcn@latest add https://sevenui.dev/r/tooltip.json Displays rich content in a portal, positioned relative to an anchor element, built on the Base UI Popover primitive.
npx shadcn@latest add https://sevenui.dev/r/popover.json Displays a preview card when hovering or focusing a link, built on the Base UI Preview Card primitive.
npx shadcn@latest add https://sevenui.dev/r/hover-card.json A window overlaid on either the primary window or another dialog window, rendering the content underneath inert, built on the Base UI Dialog primitive.
npx shadcn@latest add https://sevenui.dev/r/dialog.json A modal dialog that interrupts the user with important content and expects a response, built on the Base UI Alert Dialog primitive.
npx shadcn@latest add https://sevenui.dev/r/alert-dialog.json An edge-positioned panel that slides in from the side of the screen, built on the Base UI Dialog primitive.
npx shadcn@latest add https://sevenui.dev/r/sheet.json 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.
npx shadcn@latest add https://sevenui.dev/r/drawer.json 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.
npx shadcn@latest add https://sevenui.dev/r/dropdown-menu.json 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.
npx shadcn@latest add https://sevenui.dev/r/context-menu.json A horizontal menu bar with multiple menus — such as File, Edit, and View — built on the Base UI Menu primitive.
npx shadcn@latest add https://sevenui.dev/r/menubar.json A sonner-style, module-level toast API for showing brief, non-blocking notifications, built on the Base UI Toast primitive.
npx shadcn@latest add https://sevenui.dev/r/toast.json 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.
npx shadcn@latest add https://sevenui.dev/r/tabs.json A vertically stacked set of interactive headings that each reveal an associated panel of content, built on the Base UI Accordion primitive.
npx shadcn@latest add https://sevenui.dev/r/accordion.json An interactive component which expands/collapses a panel, built on the Base UI Collapsible primitive.
npx shadcn@latest add https://sevenui.dev/r/collapsible.json Augments native scroll functionality for custom, cross-browser styling, built on the Base UI Scroll Area primitive.
npx shadcn@latest add https://sevenui.dev/r/scroll-area.json Displays a value within a known range, built on the Base UI Meter primitive.
npx shadcn@latest add https://sevenui.dev/r/meter.json A container for grouping a set of controls, such as buttons, toggle groups, or links, built on the Base UI Toolbar primitive.
npx shadcn@latest add https://sevenui.dev/r/toolbar.json A collection of links for navigating websites, sharing one animated popup between top-level menu triggers, built on the Base UI Navigation Menu primitive.
npx shadcn@latest add https://sevenui.dev/r/navigation-menu.json A fast, composable command palette built on the Base UI Autocomplete primitive.
npx shadcn@latest add https://sevenui.dev/r/command.json A composable, themeable sidebar with collapsible, mobile, and icon-only modes.
npx shadcn@latest add https://sevenui.dev/r/sidebar.json Accessible resizable panel groups and layouts.
npx shadcn@latest add https://sevenui.dev/r/resizable.json A carousel with motion and swipe built using Embla.
npx shadcn@latest add https://sevenui.dev/r/carousel.json A date field component that lets users select dates or ranges.
npx shadcn@latest add https://sevenui.dev/r/calendar.json Composable chart primitives built on Recharts.
npx shadcn@latest add https://sevenui.dev/r/chart.json Groups related buttons with shared borders and separators.
npx shadcn@latest add https://sevenui.dev/r/button-group.json Groups an input with addons, buttons, and inline text.
npx shadcn@latest add https://sevenui.dev/r/input-group.json A flexible list item with media, content, and actions.
npx shadcn@latest add https://sevenui.dev/r/item.json Displays an empty state with media, title, description, and actions.
npx shadcn@latest add https://sevenui.dev/r/empty.json A styled native HTML select element.
npx shadcn@latest add https://sevenui.dev/r/native-select.json Re-exports the Base UI DirectionProvider for RTL support.
npx shadcn@latest add https://sevenui.dev/r/direction.json An inline marker with icon and content for annotating UI.
npx shadcn@latest add https://sevenui.dev/r/marker.json Chat message layout with avatar, content, header, and footer.
npx shadcn@latest add https://sevenui.dev/r/message.json Auto-scrolling chat viewport built on the shadcn MessageScroller primitive.
npx shadcn@latest add https://sevenui.dev/r/message-scroller.json Chat message bubbles for conversational interfaces.
npx shadcn@latest add https://sevenui.dev/r/bubble.json Displays file attachments with media previews and actions.
npx shadcn@latest add https://sevenui.dev/r/attachment.json Multi-step questionnaire flow built on the shadcn Questionnaire primitive.
npx shadcn@latest add https://sevenui.dev/r/questionnaire.json