Core structural components for organizing your application's layout and establishing a consistent foundation for your UI.
App
Encases your app to deliver global settings and additional features.
Container
A box for centering and setting a maximum width for your content.
Error
A pre-built error component with NuxtError support.
Footer
A responsive footer for displaying copyright, links, and additional information.
Header
A header that adapts its structure and content to different screen sizes.
Main
A main content element that expands to fill the full viewport height.
SidebarLayout
You incorporate a sidebar in the slider and CRM entity tab embedding. Overall, it's stylish, trendy, and youthful
Theme
A headless component for theming its child components.
Essential UI building blocks including buttons, badges, avatars, icons, and other foundational interface elements for crafting intuitive and consistent user experiences.
Advice
A couple of lines of text and an avatar
Alert
An alert designed to capture the user's attention.
Avatar
An img element that includes fallback and supports Nuxt Image.
AvatarGroup
Pile multiple avatars into a single group.
Badge
A short descriptor for a status or category.
Banner
Top banner for important user messages.
Button
A button capable of linking or performing an action.
Calendar
A calendar tool for choosing individual dates, multiple dates, or date spans.
Card
Render the content within a card component comprising a header, body, and footer section.
Chip
An indicator that shows either a number or a state.
Collapsible
A collapsible component for showing or hiding its content.
Countdown
Countdown with options control.
FieldGroup
Organize several button-like elements into a group.
Kbd
A kbd element for indicating a keyboard input.
Progress
A progress bar displaying task completion status.
Separator
Divides content in a horizontal or vertical manner.
Skeleton
A toggle control for switching between two states.
Comprehensive form components for building interactive user input experiences, including text inputs, selects, checkboxes, radio groups, switches, sliders, and complete form validation.
Checkbox
A toggle input for marking as checked or unchecked.
CheckboxGroup
Multi-select checklist using button controls.
ColorPicker
A color picker component.
FileUpload
A file upload input component.
Form
A form component designed for validation and handling submissions.
FormField
A container for form elements with built-in validation and error management.
Input
An input box designed for text entry.
InputDate
A date selection input field.
InputMenu
An input field with live autocomplete suggestions.
InputNumber
Provide numerical input with a flexible range setting.
InputTags
A tags input component with interactive tag elements.
InputTime
A time selection input field.
PinInput
A PIN code input component.
RadioGroup
A collection of radio buttons to pick a single choice from several options.
Range
A control for selecting a numeric value within a specified range.
Select
A selection field to pick from various options.
SelectMenu
A refined and searchable selection component.
Switch
A toggle control for switching between two states.
Textarea
A textarea for entering multi-line text.
Components for displaying and organizing data, including tables, accordions, carousels, timelines, trees, and user profiles.
Accordion
This is a stacked set of collapsible panels
DescriptionList
For instances requiring the conversion of a table row into its own table to enhance page completeness.
Empty
An empty state component.
ScrollArea
A flexible scrollable viewport component that implements virtualization to handle large datasets with optimal performance.
Table
A responsive data table component.
TableWrapper
Wrapper for displaying a html table
Timeline
A component for displaying a chronological sequence of events, with dates, titles, and supporting icons or avatars.
User
A component to display user details, including their name, bio, and profile picture.
Components for user navigation and wayfinding, including menus, breadcrumbs, pagination, tabs, steppers, links, and command palettes.
Breadcrumb
A breadcrumb navigation component.
CommandPalette
A searchable command palette powered by Fuse.js for fast, fuzzy text search.
FooterColumns
A set of link columns to organize navigation and information in the footer.
Link
A wrapper around <NuxtLink> with extra props.
NavigationMenu
A link list that can be arranged in horizontal or vertical orientation.
Pagination
A navigation component with buttons or links for pagination.
Stepper
A stepper component to visualize progress in a multistep workflow.
Tabs
A collection of tab panels shown individually.
Floating UI elements that appear above the main content, including modals, popovers, tooltips, drawers, slideovers, and context menus.
ContextMenu
A pop-up menu that appears upon right-clicking an element to present relevant actions.
Drawer
A toggleable drawer with fluid enter/exit transitions.
DropdownMenu
A contextual menu for actions triggered by clicking an element.
Modal
A popup window for showing messages or gathering user input.
Popover
A non-modal popup window for showing messages or gathering user input.
Slideover
A dialog that slides in from any side of the screen.
Toast
A short message to offer information or feedback to the user.
Tooltip
A small window that shows details when you move your mouse over an item.
Pre-built marketing and content sections for creating landing pages, blogs, pricing pages, and other marketing materials.
Page
A page grid divided into three columns: left sidebar, main content area, and right sidebar.
PageAside
A sticky navigation aside.
PageBody
A container for the main content of the page.
PageCard
A pre-styled card component featuring a title, description, and optional link.
PageColumns
A responsive multi-column layout system for organizing content side-by-side.
PageFeature
A feature showcase component to present your app
PageGrid
A responsive grid system for creating flexible content layouts.
PageHeader
A responsive page header.
PageLinks
A list of links to display on the page.
PageList
A vertical list layout for stacking content items.
PageSection
A responsive section.
Specialized components for building dynamic dashboards with resizable panels, collapsible sidebars, toolbars, and search functionality.
DashboardGroup
A fixed-layout dashboard container with sidebar state management and persistent UI state.
DashboardNavbar
A responsive navigation bar for dashboards.
DashboardPanel
A resizable panel component for dashboards.
DashboardResizeHandle
A resize handle for sidebars or panels.
DashboardSearch
A ready-to-use CommandPalette component for your dashboard.
DashboardSearchButton
A pre-styled button that opens the DashboardSearch modal.
DashboardSidebar
A resizable and collapsible sidebar component for dashboards.
DashboardSidebarCollapse
A desktop toggle button that collapses the sidebar to provide more space for content.
DashboardSidebarToggle
A mobile menu button that shows or hides the sidebar navigation.
DashboardToolbar
A secondary action bar positioned beneath the main navigation in dashboards.
Components for building conversational interfaces and chatbots, powered by the Vercel AI SDK.
ChatMessage
A chat message component with icon, avatar, and action buttons.
ChatMessages
A chat messages list component designed for seamless integration with the Vercel AI SDK.
ChatPalette
A chat interface component designed to be displayed in a modal overlay.
ChatPrompt
An enhanced Textarea component optimized for prompt submission in AI chat interfaces.
ChatPromptSubmit
A chat prompt submission button with automatic status handling.
Components for building a rich text editor with support for markdown, HTML, and JSON content types, powered by TipTap.
Editor
A rich text editor built on TipTap supporting markdown, HTML, and JSON content formats.
EditorDragHandle
A draggable handle component for reordering and selecting editor blocks.
EditorEmojiMenu
An emoji suggestion menu that automatically appears upon typing the colon : character in the editor.
EditorMentionMenu
A mention menu that displays user suggestions when a trigger character is typed in the editor.
EditorSuggestionMenu
A slash command menu that displays formatting and action suggestions when typing /.
EditorToolbar
A customizable toolbar for editor actions with multiple display modes: fixed, bubble, or floating.
Components that integrate with Content for documentation sites, including table of contents, search, navigation trees, and surrounding page links.
ContentSearch
A ready-to-use Command Palette component for your documentation.
ContentSearchButton
A pre-styled button that opens the content search modal.
ContentSurround
A pair of "Previous" and "Next" buttons for sequential page navigation.
ContentToc
A sticky table of contents component with dynamic active section highlighting.
Components that integrate with Color Mode for theme switching between light, dark, and system preferences.
Components that integrate with Color Mode for theme switching between light, dark, and system preferences.
ColorModeAvatar
An Avatar that automatically switches its image based on the current theme (light/dark).
ColorModeButton
A button to toggle between light and dark themes.
ColorModeImage
An image element with a different source for light and dark mode.
ColorModeSelect
A Select to switch between system, dark & light mode.
ColorModeSwitch
A switch to toggle between light and dark mode.
Components that integrate with i18n for internationalization and locale management.
Components that integrate with i18n for internationalization and locale management.
LocaleSelect
A Select to switch between locales.