[{"data":1,"prerenderedAt":3752},["ShallowReactive",2],{"navigation":3,"-docs-getting-started-theme-css-variables":918,"-docs-getting-started-theme-css-variables-description":3744},[4],{"title":5,"path":6,"stem":7,"children":8,"page":36},"Docs","/docs","docs",[9,157,781,817],{"title":10,"path":11,"stem":12,"children":13,"framework":16,"category":16,"description":16,"icon":30},"Get Started","/docs/getting-started","docs/1.getting-started/1.index",[14,19,37,47,53,76,140],{"title":15,"path":11,"stem":12,"framework":16,"category":16,"description":17,"icon":18},"Introduction",null,"Nuxt UI is a comprehensive Vue UI component library (Nuxt optional), offering 125+ accessible, Tailwind CSS components for building modern web applications.","i-lucide-house",{"title":20,"framework":16,"category":16,"description":16,"shadow":21,"path":22,"stem":23,"children":24,"page":36},"Installation",true,"/docs/getting-started/installation","docs/1.getting-started/2.installation",[25,31],{"title":20,"path":26,"stem":27,"framework":28,"category":16,"description":29,"icon":30},"/docs/getting-started/installation/nuxt","docs/1.getting-started/2.installation/1.nuxt","nuxt","Learn how to install and configure Nuxt UI in your Nuxt application.","i-lucide-square-play",{"title":20,"path":32,"stem":33,"framework":34,"category":16,"description":35,"icon":30},"/docs/getting-started/installation/vue","docs/1.getting-started/2.installation/2.vue","vue","Learn how to install and configure Nuxt UI in your Vue application, compatible with both plain Vite and Inertia.",false,{"title":38,"framework":16,"category":16,"description":16,"icon":39,"shadow":21,"path":40,"stem":41,"children":42,"page":36},"Migration","i-lucide-arrow-right-left","/docs/getting-started/migration","docs/1.getting-started/3.migration",[43],{"title":38,"path":44,"stem":45,"framework":16,"category":16,"description":46,"icon":39},"/docs/getting-started/migration/v4","docs/1.getting-started/3.migration/1.v4","A comprehensive guide to migrate your application from Nuxt UI v3 to Nuxt UI v4.",{"title":48,"path":49,"stem":50,"framework":16,"category":16,"description":51,"icon":52},"Contribution","/docs/getting-started/contribution","docs/1.getting-started/4.contribution","A comprehensive guide on contributing to Nuxt UI, including project structure, development workflow, and best practices.","i-lucide-handshake",{"title":54,"path":55,"stem":56,"children":57,"page":36},"Theme","/docs/getting-started/theme","docs/1.getting-started/5.theme",[58,64,70],{"title":59,"path":60,"stem":61,"framework":16,"category":16,"description":62,"icon":63},"Design System","/docs/getting-started/theme/design-system","docs/1.getting-started/5.theme/1.design-system","Nuxt UI's design system uses Tailwind CSS for simple theming and easy customization.","i-lucide-palette",{"title":65,"path":66,"stem":67,"framework":16,"category":16,"description":68,"icon":69},"CSS Variables","/docs/getting-started/theme/css-variables","docs/1.getting-started/5.theme/2.css-variables","Nuxt UI uses CSS variables as design tokens for flexible, consistent theming with built-in light and dark mode support.","i-lucide-swatch-book",{"title":71,"path":72,"stem":73,"framework":16,"category":16,"description":74,"icon":75},"Components","/docs/getting-started/theme/components","docs/1.getting-started/5.theme/3.components","Learn how to customize Nuxt UI components with the Tailwind Variants API for advanced, flexible, and maintainable styling.","i-lucide-layout-grid",{"title":77,"framework":16,"category":16,"description":16,"path":78,"stem":79,"children":80,"page":36},"Integrations","/docs/getting-started/integrations","docs/1.getting-started/6.integrations",[81,95,101,115,129,135],{"title":82,"framework":16,"category":16,"description":16,"shadow":21,"path":83,"stem":84,"children":85,"page":36},"Icons","/docs/getting-started/integrations/icons","docs/1.getting-started/6.integrations/1.icons",[86,91],{"title":82,"path":87,"stem":88,"framework":28,"category":16,"description":89,"icon":90},"/docs/getting-started/integrations/icons/nuxt","docs/1.getting-started/6.integrations/1.icons/1.nuxt","Nuxt UI integrates with Nuxt Icon to access over 200,000+ icons from Iconify.","i-lucide-smile",{"title":82,"path":92,"stem":93,"framework":34,"category":16,"description":94,"icon":90},"/docs/getting-started/integrations/icons/vue","docs/1.getting-started/6.integrations/1.icons/2.vue","Nuxt UI integrates with Iconify to access over 200,000+ icons.",{"title":96,"path":97,"stem":98,"framework":28,"category":16,"description":99,"icon":100},"Fonts","/docs/getting-started/integrations/fonts","docs/1.getting-started/6.integrations/2.fonts","Nuxt UI integrates with Nuxt Fonts to provide plug-and-play font optimization.","i-lucide-a-large-small",{"title":102,"framework":16,"category":16,"description":16,"shadow":21,"path":103,"stem":104,"children":105,"page":36},"Color Mode","/docs/getting-started/integrations/color-mode","docs/1.getting-started/6.integrations/3.color-mode",[106,111],{"title":102,"path":107,"stem":108,"framework":28,"category":16,"description":109,"icon":110},"/docs/getting-started/integrations/color-mode/nuxt","docs/1.getting-started/6.integrations/3.color-mode/1.nuxt","Nuxt UI integrates with Nuxt Color Mode to allow for easy switching between light and dark themes.","i-lucide-sun-moon",{"title":102,"path":112,"stem":113,"framework":34,"category":16,"description":114,"icon":110},"/docs/getting-started/integrations/color-mode/vue","docs/1.getting-started/6.integrations/3.color-mode/2.vue","Nuxt UI integrates with VueUse to allow for easy switching between light and dark themes.",{"title":116,"framework":16,"category":16,"description":16,"shadow":21,"path":117,"stem":118,"children":119,"page":36},"I18n","/docs/getting-started/integrations/i18n","docs/1.getting-started/6.integrations/4.i18n",[120,126],{"title":121,"path":122,"stem":123,"framework":28,"category":16,"description":124,"icon":125},"Internationalization (i18n)","/docs/getting-started/integrations/i18n/nuxt","docs/1.getting-started/6.integrations/4.i18n/1.nuxt","Nuxt UI supports 50+ locales and multi-directional (LTR/RTL) internationalization.","i-lucide-languages",{"title":121,"path":127,"stem":128,"framework":34,"category":16,"description":124,"icon":125},"/docs/getting-started/integrations/i18n/vue","docs/1.getting-started/6.integrations/4.i18n/2.vue",{"title":130,"path":131,"stem":132,"framework":28,"category":16,"description":133,"icon":134},"Content","/docs/getting-started/integrations/content","docs/1.getting-started/6.integrations/5.content","Nuxt UI integrates with Nuxt Content to deliver beautiful typography and consistent component styling.","i-simple-icons-markdown",{"title":136,"path":137,"stem":138,"framework":34,"category":16,"description":139,"icon":134},"SSR","/docs/getting-started/integrations/ssr","docs/1.getting-started/6.integrations/6.ssr","Nuxt UI has first-party support for Vue SSR. This guide will help you have it fully enabled.",{"title":141,"framework":16,"category":16,"description":16,"path":142,"stem":143,"children":144,"page":36},"AI Tools","/docs/getting-started/ai","docs/1.getting-started/7.ai",[145,151],{"title":146,"path":147,"stem":148,"framework":16,"category":16,"description":149,"icon":150},"MCP Server","/docs/getting-started/ai/mcp","docs/1.getting-started/7.ai/1.mcp","Use Nuxt UI components in your AI assistants with Model Context Protocol support.","i-lucide-server",{"title":152,"path":153,"stem":154,"framework":16,"category":16,"description":155,"icon":156},"LLMs.txt","/docs/getting-started/ai/llms-txt","docs/1.getting-started/7.ai/2.llms-txt","How to get AI tools like Cursor, Windsurf, GitHub Copilot, ChatGPT, and Claude to understand Nuxt UI components, theming, and best practices.","i-lucide-bot",{"title":71,"framework":16,"category":16,"description":16,"icon":158,"path":159,"stem":160,"children":161,"page":36},"i-lucide-square-code","/docs/components","docs/2.components",[162,168,174,180,186,191,196,201,206,211,216,222,227,232,237,242,247,252,258,263,268,273,278,284,289,294,299,305,310,315,320,325,330,335,340,346,351,356,361,366,372,378,383,388,393,398,403,408,413,418,423,428,433,440,445,450,455,460,465,470,475,480,485,490,495,500,505,510,515,520,525,530,535,540,545,550,555,561,566,571,576,581,586,591,596,601,606,611,616,621,626,631,636,641,646,651,656,661,666,671,676,681,686,691,696,701,706,711,716,721,726,731,736,741,746,751,756,761,766,771,776],{"title":163,"path":164,"stem":165,"framework":16,"category":166,"description":167},"Accordion","/docs/components/accordion","docs/2.components/accordion","data","A stacked set of collapsible panels.",{"title":169,"path":170,"stem":171,"framework":16,"category":172,"description":173},"Alert","/docs/components/alert","docs/2.components/alert","element","A callout to draw user's attention.",{"title":175,"path":176,"stem":177,"framework":16,"category":178,"description":179},"App","/docs/components/app","docs/2.components/app","layout","Wraps your app to provide global configurations and more.",{"title":181,"path":182,"stem":183,"framework":16,"category":184,"description":185},"AuthForm","/docs/components/auth-form","docs/2.components/auth-form","page","A customizable Form to create login, register or password reset forms.",{"title":187,"path":188,"stem":189,"framework":16,"category":172,"description":190},"Avatar","/docs/components/avatar","docs/2.components/avatar","An img element with fallback and Nuxt Image support.",{"title":192,"path":193,"stem":194,"framework":16,"category":172,"description":195},"AvatarGroup","/docs/components/avatar-group","docs/2.components/avatar-group","Stack multiple avatars in a group.",{"title":197,"path":198,"stem":199,"framework":16,"category":172,"description":200},"Badge","/docs/components/badge","docs/2.components/badge","A short text to represent a status or a category.",{"title":202,"path":203,"stem":204,"framework":16,"category":172,"description":205},"Banner","/docs/components/banner","docs/2.components/banner","Display a banner at the top of your website to inform users about important information.",{"title":207,"path":208,"stem":209,"framework":16,"category":184,"description":210},"BlogPost","/docs/components/blog-post","docs/2.components/blog-post","A customizable article to display in a blog page.",{"title":212,"path":213,"stem":214,"framework":16,"category":184,"description":215},"BlogPosts","/docs/components/blog-posts","docs/2.components/blog-posts","Display a list of blog posts in a responsive grid layout.",{"title":217,"path":218,"stem":219,"framework":16,"category":220,"description":221},"Breadcrumb","/docs/components/breadcrumb","docs/2.components/breadcrumb","navigation","A hierarchy of links to navigate through a website.",{"title":223,"path":224,"stem":225,"framework":16,"category":172,"description":226},"Button","/docs/components/button","docs/2.components/button","A button element that can act as a link or trigger an action.",{"title":228,"path":229,"stem":230,"framework":16,"category":172,"description":231},"Calendar","/docs/components/calendar","docs/2.components/calendar","A calendar component for selecting single dates, multiple dates or date ranges.",{"title":233,"path":234,"stem":235,"framework":16,"category":172,"description":236},"Card","/docs/components/card","docs/2.components/card","Display content in a card with a header, body and footer.",{"title":238,"path":239,"stem":240,"framework":16,"category":166,"description":241},"Carousel","/docs/components/carousel","docs/2.components/carousel","A carousel with motion and swipe built using Embla.",{"title":243,"path":244,"stem":245,"framework":16,"category":184,"description":246},"ChangelogVersion","/docs/components/changelog-version","docs/2.components/changelog-version","A customizable article to display in a changelog.",{"title":248,"path":249,"stem":250,"framework":16,"category":184,"description":251},"ChangelogVersions","/docs/components/changelog-versions","docs/2.components/changelog-versions","Display a list of changelog versions in a timeline.",{"title":253,"path":254,"stem":255,"framework":16,"category":256,"description":257},"ChatMessage","/docs/components/chat-message","docs/2.components/chat-message","chat","Display a chat message with icon, avatar, and actions.",{"title":259,"path":260,"stem":261,"framework":16,"category":256,"description":262},"ChatMessages","/docs/components/chat-messages","docs/2.components/chat-messages","Display a list of chat messages, designed to work seamlessly with Vercel AI SDK.",{"title":264,"path":265,"stem":266,"framework":16,"category":256,"description":267},"ChatPalette","/docs/components/chat-palette","docs/2.components/chat-palette","A chat palette to create a chatbot interface inside an overlay.",{"title":269,"path":270,"stem":271,"framework":16,"category":256,"description":272},"ChatPrompt","/docs/components/chat-prompt","docs/2.components/chat-prompt","An enhanced Textarea for submitting prompts in AI chat interfaces.",{"title":274,"path":275,"stem":276,"framework":16,"category":256,"description":277},"ChatPromptSubmit","/docs/components/chat-prompt-submit","docs/2.components/chat-prompt-submit","A Button for submitting chat prompts with automatic status handling.",{"title":279,"path":280,"stem":281,"framework":16,"category":282,"description":283},"Checkbox","/docs/components/checkbox","docs/2.components/checkbox","form","An input element to toggle between checked and unchecked states.",{"title":285,"path":286,"stem":287,"framework":16,"category":282,"description":288},"CheckboxGroup","/docs/components/checkbox-group","docs/2.components/checkbox-group","A set of checklist buttons to select multiple option from a list.",{"title":290,"path":291,"stem":292,"framework":16,"category":172,"description":293},"Chip","/docs/components/chip","docs/2.components/chip","An indicator of a numeric value or a state.",{"title":295,"path":296,"stem":297,"framework":16,"category":172,"description":298},"Collapsible","/docs/components/collapsible","docs/2.components/collapsible","A collapsible element to toggle visibility of its content.",{"title":300,"path":301,"stem":302,"framework":16,"category":303,"description":304},"ColorModeAvatar","/docs/components/color-mode-avatar","docs/2.components/color-mode-avatar","color-mode","An Avatar with a different source for light and dark mode.",{"title":306,"path":307,"stem":308,"framework":16,"category":303,"description":309},"ColorModeButton","/docs/components/color-mode-button","docs/2.components/color-mode-button","A Button to switch between light and dark mode.",{"title":311,"path":312,"stem":313,"framework":16,"category":303,"description":314},"ColorModeImage","/docs/components/color-mode-image","docs/2.components/color-mode-image","An image element with a different source for light and dark mode.",{"title":316,"path":317,"stem":318,"framework":16,"category":303,"description":319},"ColorModeSelect","/docs/components/color-mode-select","docs/2.components/color-mode-select","A Select to switch between system, dark & light mode.",{"title":321,"path":322,"stem":323,"framework":16,"category":303,"description":324},"ColorModeSwitch","/docs/components/color-mode-switch","docs/2.components/color-mode-switch","A switch to toggle between light and dark mode.",{"title":326,"path":327,"stem":328,"framework":16,"category":282,"description":329},"ColorPicker","/docs/components/color-picker","docs/2.components/color-picker","A component to select a color.",{"title":331,"path":332,"stem":333,"framework":16,"category":220,"description":334},"CommandPalette","/docs/components/command-palette","docs/2.components/command-palette","A command palette with full-text search powered by Fuse.js for efficient fuzzy matching.",{"title":336,"path":337,"stem":338,"framework":16,"category":178,"description":339},"Container","/docs/components/container","docs/2.components/container","A container lets you center and constrain the width of your content.",{"title":341,"path":342,"stem":343,"framework":28,"category":344,"description":345},"ContentNavigation","/docs/components/content-navigation","docs/2.components/content-navigation","content","An accordion-style navigation component for organizing page links.",{"title":347,"path":348,"stem":349,"framework":28,"category":344,"description":350},"ContentSearch","/docs/components/content-search","docs/2.components/content-search","A ready to use CommandPalette to add to your documentation.",{"title":352,"path":353,"stem":354,"framework":28,"category":344,"description":355},"ContentSearchButton","/docs/components/content-search-button","docs/2.components/content-search-button","A pre-styled Button to open the ContentSearch modal.",{"title":357,"path":358,"stem":359,"framework":28,"category":344,"description":360},"ContentSurround","/docs/components/content-surround","docs/2.components/content-surround","A pair of prev and next links to navigate between pages.",{"title":362,"path":363,"stem":364,"framework":28,"category":344,"description":365},"ContentToc","/docs/components/content-toc","docs/2.components/content-toc","A sticky Table of Contents with automatic active anchor link highlighting.",{"title":367,"path":368,"stem":369,"framework":16,"category":370,"description":371},"ContextMenu","/docs/components/context-menu","docs/2.components/context-menu","overlay","A menu to display actions when right-clicking on an element.",{"title":373,"path":374,"stem":375,"framework":16,"category":376,"description":377},"DashboardGroup","/docs/components/dashboard-group","docs/2.components/dashboard-group","dashboard","A fixed layout component that provides context for dashboard components with sidebar state management and persistence.",{"title":379,"path":380,"stem":381,"framework":16,"category":376,"description":382},"DashboardNavbar","/docs/components/dashboard-navbar","docs/2.components/dashboard-navbar","A responsive navbar to display in a dashboard.",{"title":384,"path":385,"stem":386,"framework":16,"category":376,"description":387},"DashboardPanel","/docs/components/dashboard-panel","docs/2.components/dashboard-panel","A resizable panel to display in a dashboard.",{"title":389,"path":390,"stem":391,"framework":16,"category":376,"description":392},"DashboardResizeHandle","/docs/components/dashboard-resize-handle","docs/2.components/dashboard-resize-handle","A handle to resize a sidebar or panel.",{"title":394,"path":395,"stem":396,"framework":16,"category":376,"description":397},"DashboardSearch","/docs/components/dashboard-search","docs/2.components/dashboard-search","A ready to use CommandPalette to add to your dashboard.",{"title":399,"path":400,"stem":401,"framework":16,"category":376,"description":402},"DashboardSearchButton","/docs/components/dashboard-search-button","docs/2.components/dashboard-search-button","A pre-styled Button to open the DashboardSearch modal.",{"title":404,"path":405,"stem":406,"framework":16,"category":376,"description":407},"DashboardSidebar","/docs/components/dashboard-sidebar","docs/2.components/dashboard-sidebar","A resizable and collapsible sidebar to display in a dashboard.",{"title":409,"path":410,"stem":411,"framework":16,"category":376,"description":412},"DashboardSidebarCollapse","/docs/components/dashboard-sidebar-collapse","docs/2.components/dashboard-sidebar-collapse","A Button to collapse the sidebar on desktop.",{"title":414,"path":415,"stem":416,"framework":16,"category":376,"description":417},"DashboardSidebarToggle","/docs/components/dashboard-sidebar-toggle","docs/2.components/dashboard-sidebar-toggle","A Button to toggle the sidebar on mobile.",{"title":419,"path":420,"stem":421,"framework":16,"category":376,"description":422},"DashboardToolbar","/docs/components/dashboard-toolbar","docs/2.components/dashboard-toolbar","A toolbar to display under the navbar in a dashboard.",{"title":424,"path":425,"stem":426,"framework":16,"category":370,"description":427},"Drawer","/docs/components/drawer","docs/2.components/drawer","A drawer that smoothly slides in & out of the screen.",{"title":429,"path":430,"stem":431,"framework":16,"category":370,"description":432},"DropdownMenu","/docs/components/dropdown-menu","docs/2.components/dropdown-menu","A menu to display actions when clicking on an element.",{"title":434,"path":435,"stem":436,"framework":16,"category":437,"description":438,"badge":439},"Editor","/docs/components/editor","docs/2.components/editor","editor","A rich text editor component based on TipTap with support for markdown, HTML, and JSON content types.","New",{"title":441,"path":442,"stem":443,"framework":16,"category":437,"description":444,"badge":439},"EditorDragHandle","/docs/components/editor-drag-handle","docs/2.components/editor-drag-handle","A draggable handle for reordering and selecting blocks in the editor.",{"title":446,"path":447,"stem":448,"framework":16,"category":437,"description":449,"badge":439},"EditorEmojiMenu","/docs/components/editor-emoji-menu","docs/2.components/editor-emoji-menu","An emoji picker menu that displays emoji suggestions when typing the : character in the editor.",{"title":451,"path":452,"stem":453,"framework":16,"category":437,"description":454,"badge":439},"EditorMentionMenu","/docs/components/editor-mention-menu","docs/2.components/editor-mention-menu","A mention menu that displays user suggestions when typing the @ character in the editor.",{"title":456,"path":457,"stem":458,"framework":16,"category":437,"description":459,"badge":439},"EditorSuggestionMenu","/docs/components/editor-suggestion-menu","docs/2.components/editor-suggestion-menu","A command menu that displays formatting and action suggestions when typing the / character in the editor.",{"title":461,"path":462,"stem":463,"framework":16,"category":437,"description":464,"badge":439},"EditorToolbar","/docs/components/editor-toolbar","docs/2.components/editor-toolbar","A customizable toolbar for editor actions that can be displayed as fixed, bubble, or floating menu.",{"title":466,"path":467,"stem":468,"framework":16,"category":166,"description":469},"Empty","/docs/components/empty","docs/2.components/empty","A component to display an empty state.",{"title":471,"path":472,"stem":473,"framework":16,"category":178,"description":474},"Error","/docs/components/error","docs/2.components/error","A pre-built error component with NuxtError support.",{"title":476,"path":477,"stem":478,"framework":16,"category":172,"description":479},"FieldGroup","/docs/components/field-group","docs/2.components/field-group","Group multiple button-like elements together.",{"title":481,"path":482,"stem":483,"framework":16,"category":282,"description":484},"FileUpload","/docs/components/file-upload","docs/2.components/file-upload","An input element to upload files.",{"title":486,"path":487,"stem":488,"framework":16,"category":178,"description":489},"Footer","/docs/components/footer","docs/2.components/footer","A responsive footer component.",{"title":491,"path":492,"stem":493,"framework":16,"category":220,"description":494},"FooterColumns","/docs/components/footer-columns","docs/2.components/footer-columns","A list of links as columns to display in your Footer.",{"title":496,"path":497,"stem":498,"framework":16,"category":282,"description":499},"Form","/docs/components/form","docs/2.components/form","A form component with built-in validation and submission handling.",{"title":501,"path":502,"stem":503,"framework":16,"category":282,"description":504},"FormField","/docs/components/form-field","docs/2.components/form-field","A wrapper for form elements that provides validation and error handling.",{"title":506,"path":507,"stem":508,"framework":16,"category":178,"description":509},"Header","/docs/components/header","docs/2.components/header","A responsive header component.",{"title":511,"path":512,"stem":513,"framework":16,"category":172,"description":514},"Icon","/docs/components/icon","docs/2.components/icon","A component to display any icon from Iconify or another component.",{"title":516,"path":517,"stem":518,"framework":16,"category":282,"description":519},"Input","/docs/components/input","docs/2.components/input","An input element to enter text.",{"title":521,"path":522,"stem":523,"framework":16,"category":282,"description":524},"InputDate","/docs/components/input-date","docs/2.components/input-date","An input component for date selection.",{"title":526,"path":527,"stem":528,"framework":16,"category":282,"description":529},"InputMenu","/docs/components/input-menu","docs/2.components/input-menu","An autocomplete input with real-time suggestions.",{"title":531,"path":532,"stem":533,"framework":16,"category":282,"description":534},"InputNumber","/docs/components/input-number","docs/2.components/input-number","An input for numerical values with a customizable range.",{"title":536,"path":537,"stem":538,"framework":16,"category":282,"description":539},"InputTags","/docs/components/input-tags","docs/2.components/input-tags","An input element that displays interactive tags.",{"title":541,"path":542,"stem":543,"framework":16,"category":282,"description":544},"InputTime","/docs/components/input-time","docs/2.components/input-time","An input for selecting a time.",{"title":546,"path":547,"stem":548,"framework":16,"category":172,"description":549},"Kbd","/docs/components/kbd","docs/2.components/kbd","A kbd element to display a keyboard key.",{"title":551,"path":552,"stem":553,"framework":16,"category":220,"description":554},"Link","/docs/components/link","docs/2.components/link","A wrapper around \u003CNuxtLink> with extra props.",{"title":556,"path":557,"stem":558,"framework":16,"category":559,"description":560},"LocaleSelect","/docs/components/locale-select","docs/2.components/locale-select","i18n","A Select to switch between locales.",{"title":562,"path":563,"stem":564,"framework":16,"category":178,"description":565},"Main","/docs/components/main","docs/2.components/main","A main element that fills the available viewport height.",{"title":567,"path":568,"stem":569,"framework":16,"category":166,"description":570},"Marquee","/docs/components/marquee","docs/2.components/marquee","A component to create infinite scrolling content.",{"title":572,"path":573,"stem":574,"framework":16,"category":370,"description":575},"Modal","/docs/components/modal","docs/2.components/modal","A dialog window that can be used to display a message or request user input.",{"title":577,"path":578,"stem":579,"framework":16,"category":220,"description":580},"NavigationMenu","/docs/components/navigation-menu","docs/2.components/navigation-menu","A list of links that can be displayed horizontally or vertically.",{"title":582,"path":583,"stem":584,"framework":16,"category":184,"description":585},"Page","/docs/components/page","docs/2.components/page","A grid layout for your pages with left and right columns.",{"title":587,"path":588,"stem":589,"framework":16,"category":184,"description":590},"PageAnchors","/docs/components/page-anchors","docs/2.components/page-anchors","A list of anchors to be displayed in the page.",{"title":592,"path":593,"stem":594,"framework":16,"category":184,"description":595},"PageAside","/docs/components/page-aside","docs/2.components/page-aside","A sticky aside to display your page navigation.",{"title":597,"path":598,"stem":599,"framework":16,"category":184,"description":600},"PageBody","/docs/components/page-body","docs/2.components/page-body","The main content of your page.",{"title":602,"path":603,"stem":604,"framework":16,"category":184,"description":605},"PageCard","/docs/components/page-card","docs/2.components/page-card","A pre-styled card component that displays a title, description and optional link.",{"title":607,"path":608,"stem":609,"framework":16,"category":184,"description":610},"PageColumns","/docs/components/page-columns","docs/2.components/page-columns","A responsive multi-column layout system for organizing content side-by-side.",{"title":612,"path":613,"stem":614,"framework":16,"category":184,"description":615},"PageCTA","/docs/components/page-cta","docs/2.components/page-cta","A call to action section to display in your pages.",{"title":617,"path":618,"stem":619,"framework":16,"category":184,"description":620},"PageFeature","/docs/components/page-feature","docs/2.components/page-feature","A component to showcase key features of your application.",{"title":622,"path":623,"stem":624,"framework":16,"category":184,"description":625},"PageGrid","/docs/components/page-grid","docs/2.components/page-grid","A responsive grid system for displaying content in a flexible layout.",{"title":627,"path":628,"stem":629,"framework":16,"category":184,"description":630},"PageHeader","/docs/components/page-header","docs/2.components/page-header","A responsive header for your pages.",{"title":632,"path":633,"stem":634,"framework":16,"category":184,"description":635},"PageHero","/docs/components/page-hero","docs/2.components/page-hero","A responsive hero for your pages.",{"title":637,"path":638,"stem":639,"framework":16,"category":184,"description":640},"PageLinks","/docs/components/page-links","docs/2.components/page-links","A list of links to be displayed in the page.",{"title":642,"path":643,"stem":644,"framework":16,"category":184,"description":645},"PageList","/docs/components/page-list","docs/2.components/page-list","A vertical list layout for displaying content in a stacked format.",{"title":647,"path":648,"stem":649,"framework":16,"category":184,"description":650},"PageLogos","/docs/components/page-logos","docs/2.components/page-logos","A list of logos or images to display on your pages.",{"title":652,"path":653,"stem":654,"framework":16,"category":184,"description":655},"PageSection","/docs/components/page-section","docs/2.components/page-section","A responsive section for your pages.",{"title":657,"path":658,"stem":659,"framework":16,"category":220,"description":660},"Pagination","/docs/components/pagination","docs/2.components/pagination","A list of buttons or links to navigate through pages.",{"title":662,"path":663,"stem":664,"framework":16,"category":282,"description":665},"PinInput","/docs/components/pin-input","docs/2.components/pin-input","An input element to enter a pin.",{"title":667,"path":668,"stem":669,"framework":16,"category":370,"description":670},"Popover","/docs/components/popover","docs/2.components/popover","A non-modal dialog that floats around a trigger element.",{"title":672,"path":673,"stem":674,"framework":16,"category":184,"description":675},"PricingPlan","/docs/components/pricing-plan","docs/2.components/pricing-plan","A customizable pricing plan to display in a pricing page.",{"title":677,"path":678,"stem":679,"framework":16,"category":184,"description":680},"PricingPlans","/docs/components/pricing-plans","docs/2.components/pricing-plans","Display a list of pricing plans in a responsive grid layout.",{"title":682,"path":683,"stem":684,"framework":16,"category":184,"description":685},"PricingTable","/docs/components/pricing-table","docs/2.components/pricing-table","A responsive pricing table component that displays tiered pricing plans with feature comparisons.",{"title":687,"path":688,"stem":689,"framework":16,"category":172,"description":690},"Progress","/docs/components/progress","docs/2.components/progress","An indicator showing the progress of a task.",{"title":692,"path":693,"stem":694,"framework":16,"category":282,"description":695},"RadioGroup","/docs/components/radio-group","docs/2.components/radio-group","A set of radio buttons to select a single option from a list.",{"title":697,"path":698,"stem":699,"framework":16,"category":166,"description":700,"badge":439},"ScrollArea","/docs/components/scroll-area","docs/2.components/scroll-area","A flexible scroll container with virtualization support.",{"title":702,"path":703,"stem":704,"framework":16,"category":282,"description":705},"Select","/docs/components/select","docs/2.components/select","A select element to choose from a list of options.",{"title":707,"path":708,"stem":709,"framework":16,"category":282,"description":710},"SelectMenu","/docs/components/select-menu","docs/2.components/select-menu","An advanced searchable select element.",{"title":712,"path":713,"stem":714,"framework":16,"category":172,"description":715},"Separator","/docs/components/separator","docs/2.components/separator","Separates content horizontally or vertically.",{"title":717,"path":718,"stem":719,"framework":16,"category":172,"description":720},"Skeleton","/docs/components/skeleton","docs/2.components/skeleton","A placeholder to show while content is loading.",{"title":722,"path":723,"stem":724,"framework":16,"category":370,"description":725},"Slideover","/docs/components/slideover","docs/2.components/slideover","A dialog that slides in from any side of the screen.",{"title":727,"path":728,"stem":729,"framework":16,"category":282,"description":730},"Slider","/docs/components/slider","docs/2.components/slider","An input to select a numeric value within a range.",{"title":732,"path":733,"stem":734,"framework":16,"category":220,"description":735},"Stepper","/docs/components/stepper","docs/2.components/stepper","A set of steps that are used to indicate progress through a multi-step process.",{"title":737,"path":738,"stem":739,"framework":16,"category":282,"description":740},"Switch","/docs/components/switch","docs/2.components/switch","A control that toggles between two states.",{"title":742,"path":743,"stem":744,"framework":16,"category":166,"description":745},"Table","/docs/components/table","docs/2.components/table","A responsive table element to display data in rows and columns.",{"title":747,"path":748,"stem":749,"framework":16,"category":220,"description":750},"Tabs","/docs/components/tabs","docs/2.components/tabs","A set of tab panels that are displayed one at a time.",{"title":752,"path":753,"stem":754,"framework":16,"category":282,"description":755},"Textarea","/docs/components/textarea","docs/2.components/textarea","A textarea element to input multi-line text.",{"title":757,"path":758,"stem":759,"framework":16,"category":166,"description":760},"Timeline","/docs/components/timeline","docs/2.components/timeline","A component that displays a sequence of events with dates, titles, icons or avatars.",{"title":762,"path":763,"stem":764,"framework":16,"category":370,"description":765},"Toast","/docs/components/toast","docs/2.components/toast","A succinct message to provide information or feedback to the user.",{"title":767,"path":768,"stem":769,"framework":16,"category":370,"description":770},"Tooltip","/docs/components/tooltip","docs/2.components/tooltip","A popup that reveals information when hovering over an element.",{"title":772,"path":773,"stem":774,"framework":16,"category":166,"description":775},"Tree","/docs/components/tree","docs/2.components/tree","A tree view component to display and interact with hierarchical data structures.",{"title":777,"path":778,"stem":779,"framework":16,"category":166,"description":780},"User","/docs/components/user","docs/2.components/user","Display user information with name, description and avatar.",{"title":782,"framework":16,"category":16,"description":16,"icon":783,"path":784,"stem":785,"children":786,"page":36},"Composables","i-lucide-square-function","/docs/composables","docs/3.composables",[787,792,797,802,807,812],{"title":788,"path":789,"stem":790,"framework":16,"category":16,"description":791},"defineLocale","/docs/composables/define-locale","docs/3.composables/define-locale","A utility to create a custom locale for your app.",{"title":793,"path":794,"stem":795,"framework":16,"category":16,"description":796},"defineShortcuts","/docs/composables/define-shortcuts","docs/3.composables/define-shortcuts","A composable to define keyboard shortcuts in your app.",{"title":798,"path":799,"stem":800,"framework":16,"category":16,"description":801},"extendLocale","/docs/composables/extend-locale","docs/3.composables/extend-locale","A utility to extend an existing locale with custom translations.",{"title":803,"path":804,"stem":805,"framework":16,"category":16,"description":806},"extractShortcuts","/docs/composables/extract-shortcuts","docs/3.composables/extract-shortcuts","A utility to extract keyboard shortcuts from menu items.",{"title":808,"path":809,"stem":810,"framework":16,"category":16,"description":811},"useOverlay","/docs/composables/use-overlay","docs/3.composables/use-overlay","A composable to programmatically control overlays.",{"title":813,"path":814,"stem":815,"framework":16,"category":16,"description":816},"useToast","/docs/composables/use-toast","docs/3.composables/use-toast","A composable to display toast notifications in your app.",{"title":818,"path":819,"stem":820,"children":821,"framework":28,"category":16,"description":16,"icon":917},"Typography","/docs/typography","docs/4.typography/1.index",[822,824,829,834,839,844,849,853,858,862,867,872,877,882,887,891,896,900,904,908,913],{"title":15,"path":819,"stem":820,"framework":28,"category":16,"description":823},"Beautiful typography components and utilities to style your content with Nuxt UI.",{"title":825,"path":826,"stem":827,"framework":28,"category":16,"description":828},"Headers and text","/docs/typography/headers-and-text","docs/4.typography/2.headers-and-text","Beautifully styled headings, paragraphs, text formatting, and links for optimal readability.",{"title":830,"path":831,"stem":832,"framework":28,"category":16,"description":833},"Lists and tables","/docs/typography/lists-and-tables","docs/4.typography/3.lists-and-tables","Organize information with styled lists and responsive tables for clear, consistent readability.",{"title":835,"path":836,"stem":837,"framework":28,"category":16,"description":838},"Images and embeds","/docs/typography/images-and-embeds","docs/4.typography/4.images-and-embeds","Responsive images, videos, and rich media embeds to enhance and illustrate your documentation.",{"title":840,"path":841,"stem":842,"framework":28,"category":16,"description":843},"Code","/docs/typography/code","docs/4.typography/5.code","Display inline code and syntax-highlighted code blocks with copy-to-clipboard support.",{"title":163,"path":845,"stem":846,"framework":28,"category":847,"description":848},"/docs/typography/accordion","docs/4.typography/accordion","components","Create expandable content sections for better information organization.",{"title":197,"path":850,"stem":851,"framework":28,"category":847,"description":852},"/docs/typography/badge","docs/4.typography/badge","Display version numbers, status labels, and tags within your content.",{"title":854,"path":855,"stem":856,"framework":28,"category":847,"description":857},"Callout","/docs/typography/callout","docs/4.typography/callout","Highlight important information with eye-catching colored boxes and icons.",{"title":233,"path":859,"stem":860,"framework":28,"category":847,"description":861},"/docs/typography/card","docs/4.typography/card","Create highlighted content blocks with optional links and navigation.",{"title":863,"path":864,"stem":865,"framework":28,"category":847,"description":866},"CardGroup","/docs/typography/card-group","docs/4.typography/card-group","Organize multiple cards in responsive grid layouts for better content presentation.",{"title":868,"path":869,"stem":870,"framework":28,"category":847,"description":871},"CodeCollapse","/docs/typography/code-collapse","docs/4.typography/code-collapse","Make long code blocks collapsible to save space and improve readability.",{"title":873,"path":874,"stem":875,"framework":28,"category":847,"description":876},"CodeGroup","/docs/typography/code-group","docs/4.typography/code-group","Group multiple code examples in tabbed interfaces for easy comparison.",{"title":878,"path":879,"stem":880,"framework":28,"category":847,"description":881},"CodePreview","/docs/typography/code-preview","docs/4.typography/code-preview","Display code examples with a preview and their source for clearer documentation.",{"title":883,"path":884,"stem":885,"framework":28,"category":847,"description":886},"CodeTree","/docs/typography/code-tree","docs/4.typography/code-tree","Visualize file and folder structures with syntax-highlighted code.",{"title":295,"path":888,"stem":889,"framework":28,"category":847,"description":890},"/docs/typography/collapsible","docs/4.typography/collapsible","Toggle content visibility with smooth expand and collapse animations.",{"title":892,"path":893,"stem":894,"framework":28,"category":847,"description":895},"Field","/docs/typography/field","docs/4.typography/field","Document API parameters, props, and configuration options clearly.",{"title":476,"path":897,"stem":898,"framework":28,"category":847,"description":899},"/docs/typography/field-group","docs/4.typography/field-group","Group related fields together for comprehensive API documentation.",{"title":511,"path":901,"stem":902,"framework":28,"category":847,"description":903},"/docs/typography/icon","docs/4.typography/icon","Display icons from popular icon libraries to enhance your content.",{"title":546,"path":905,"stem":906,"framework":28,"category":847,"description":907},"/docs/typography/kbd","docs/4.typography/kbd","Display keyboard shortcuts and key combinations with proper styling.",{"title":909,"path":910,"stem":911,"framework":28,"category":847,"description":912},"Steps","/docs/typography/steps","docs/4.typography/steps","Transform headings into numbered step-by-step guides and tutorials.",{"title":747,"path":914,"stem":915,"framework":28,"category":847,"description":916},"/docs/typography/tabs","docs/4.typography/tabs","Organize related content in interactive tabbed interfaces.","i-lucide-square-pilcrow",{"id":919,"title":65,"body":920,"category":16,"description":68,"extension":3097,"framework":16,"links":16,"meta":3740,"navigation":3741,"path":66,"seo":3742,"stem":67,"__hash__":3743},"docs/docs/1.getting-started/5.theme/2.css-variables.md",{"type":921,"value":922,"toc":3730},"minimark",[923,928,947,1190,1193,1430,1541,1648,1652,1661,1874,1876,2085,2177,2181,2190,2373,2375,2551,2647,2651,2660,2811,2813,2961,3056,3060,3080,3322,3329,3359,3422,3433,3436,3446,3480,3568,3571,3579,3614,3681,3685,3699,3726],[924,925,927],"h2",{"id":926},"colors","Colors",[929,930,931,932,937,938,942,943,946],"p",{},"Nuxt UI provides Tailwind CSS utility classes for each ",[933,934,936],"a",{"href":935},"/docs/getting-started/theme/design-system#semantic-colors","semantic color"," you define, allowing you to use class names like ",[939,940,941],"code",{},"text-error"," or ",[939,944,945],{},"bg-success",":",[948,949,950,985],"code-preview",{},[929,951,952,962,967,972,977,982],{},[953,954,961],"span",{"className":955},[956,957,958,959,960],"text-primary","text-sm","px-4","py-1.5","inline-block","Primary",[953,963,966],{"className":964},[965,957,958,959,960],"text-secondary","Secondary",[953,968,971],{"className":969},[970,957,958,959,960],"text-success","Success",[953,973,976],{"className":974},[975,957,958,959,960],"text-info","Info",[953,978,981],{"className":979},[980,957,958,959,960],"text-warning","Warning",[953,983,471],{"className":984},[941,957,958,959,960],[986,987,989],"template",{"v-slot:code":988},"",[990,991,994],"pre",{"className":992,"code":993,"language":34,"meta":988,"style":988},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n  \u003Cspan class=\"text-primary\">Primary\u003C/span>\n  \u003Cspan class=\"text-secondary\">Secondary\u003C/span>\n  \u003Cspan class=\"text-success\">Success\u003C/span>\n  \u003Cspan class=\"text-info\">Info\u003C/span>\n  \u003Cspan class=\"text-warning\">Warning\u003C/span>\n  \u003Cspan class=\"text-error\">Error\u003C/span>\n\u003C/template>\n",[939,995,996,1010,1046,1073,1100,1127,1154,1181],{"__ignoreMap":988},[953,997,1000,1004,1007],{"class":998,"line":999},"line",1,[953,1001,1003],{"class":1002},"sMK4o","\u003C",[953,1005,986],{"class":1006},"swJcz",[953,1008,1009],{"class":1002},">\n",[953,1011,1013,1016,1018,1022,1025,1028,1031,1033,1036,1039,1042,1044],{"class":998,"line":1012},2,[953,1014,1015],{"class":1002},"  \u003C",[953,1017,953],{"class":1006},[953,1019,1021],{"class":1020},"spNyl"," class",[953,1023,1024],{"class":1002},"=",[953,1026,1027],{"class":1002},"\"",[953,1029,956],{"class":1030},"sfazB",[953,1032,1027],{"class":1002},[953,1034,1035],{"class":1002},">",[953,1037,961],{"class":1038},"sTEyZ",[953,1040,1041],{"class":1002},"\u003C/",[953,1043,953],{"class":1006},[953,1045,1009],{"class":1002},[953,1047,1049,1051,1053,1055,1057,1059,1061,1063,1065,1067,1069,1071],{"class":998,"line":1048},3,[953,1050,1015],{"class":1002},[953,1052,953],{"class":1006},[953,1054,1021],{"class":1020},[953,1056,1024],{"class":1002},[953,1058,1027],{"class":1002},[953,1060,965],{"class":1030},[953,1062,1027],{"class":1002},[953,1064,1035],{"class":1002},[953,1066,966],{"class":1038},[953,1068,1041],{"class":1002},[953,1070,953],{"class":1006},[953,1072,1009],{"class":1002},[953,1074,1076,1078,1080,1082,1084,1086,1088,1090,1092,1094,1096,1098],{"class":998,"line":1075},4,[953,1077,1015],{"class":1002},[953,1079,953],{"class":1006},[953,1081,1021],{"class":1020},[953,1083,1024],{"class":1002},[953,1085,1027],{"class":1002},[953,1087,970],{"class":1030},[953,1089,1027],{"class":1002},[953,1091,1035],{"class":1002},[953,1093,971],{"class":1038},[953,1095,1041],{"class":1002},[953,1097,953],{"class":1006},[953,1099,1009],{"class":1002},[953,1101,1103,1105,1107,1109,1111,1113,1115,1117,1119,1121,1123,1125],{"class":998,"line":1102},5,[953,1104,1015],{"class":1002},[953,1106,953],{"class":1006},[953,1108,1021],{"class":1020},[953,1110,1024],{"class":1002},[953,1112,1027],{"class":1002},[953,1114,975],{"class":1030},[953,1116,1027],{"class":1002},[953,1118,1035],{"class":1002},[953,1120,976],{"class":1038},[953,1122,1041],{"class":1002},[953,1124,953],{"class":1006},[953,1126,1009],{"class":1002},[953,1128,1130,1132,1134,1136,1138,1140,1142,1144,1146,1148,1150,1152],{"class":998,"line":1129},6,[953,1131,1015],{"class":1002},[953,1133,953],{"class":1006},[953,1135,1021],{"class":1020},[953,1137,1024],{"class":1002},[953,1139,1027],{"class":1002},[953,1141,980],{"class":1030},[953,1143,1027],{"class":1002},[953,1145,1035],{"class":1002},[953,1147,981],{"class":1038},[953,1149,1041],{"class":1002},[953,1151,953],{"class":1006},[953,1153,1009],{"class":1002},[953,1155,1157,1159,1161,1163,1165,1167,1169,1171,1173,1175,1177,1179],{"class":998,"line":1156},7,[953,1158,1015],{"class":1002},[953,1160,953],{"class":1006},[953,1162,1021],{"class":1020},[953,1164,1024],{"class":1002},[953,1166,1027],{"class":1002},[953,1168,941],{"class":1030},[953,1170,1027],{"class":1002},[953,1172,1035],{"class":1002},[953,1174,471],{"class":1038},[953,1176,1041],{"class":1002},[953,1178,953],{"class":1006},[953,1180,1009],{"class":1002},[953,1182,1184,1186,1188],{"class":998,"line":1183},8,[953,1185,1041],{"class":1002},[953,1187,986],{"class":1006},[953,1189,1009],{"class":1002},[929,1191,1192],{},"Each utility class uses a CSS variable to set its color for light and dark modes:",[1194,1195,1196,1319],"code-group",{},[990,1197,1202],{"className":1198,"code":1199,"filename":1200,"language":1201,"meta":988,"style":988},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight",":root {\n  --ui-primary: var(--ui-color-primary-500);\n  --ui-secondary: var(--ui-color-secondary-500);\n  --ui-success: var(--ui-color-success-500);\n  --ui-info: var(--ui-color-info-500);\n  --ui-warning: var(--ui-color-warning-500);\n  --ui-error: var(--ui-color-error-500);\n}\n","Light","css",[939,1203,1204,1214,1234,1250,1266,1282,1298,1314],{"__ignoreMap":988},[953,1205,1206,1208,1211],{"class":998,"line":999},[953,1207,946],{"class":1002},[953,1209,1210],{"class":1020},"root",[953,1212,1213],{"class":1002}," {\n",[953,1215,1216,1219,1221,1225,1228,1231],{"class":998,"line":1012},[953,1217,1218],{"class":1038},"  --ui-primary",[953,1220,946],{"class":1002},[953,1222,1224],{"class":1223},"s2Zo4"," var",[953,1226,1227],{"class":1002},"(",[953,1229,1230],{"class":1038},"--ui-color-primary-500",[953,1232,1233],{"class":1002},");\n",[953,1235,1236,1239,1241,1243,1245,1248],{"class":998,"line":1048},[953,1237,1238],{"class":1038},"  --ui-secondary",[953,1240,946],{"class":1002},[953,1242,1224],{"class":1223},[953,1244,1227],{"class":1002},[953,1246,1247],{"class":1038},"--ui-color-secondary-500",[953,1249,1233],{"class":1002},[953,1251,1252,1255,1257,1259,1261,1264],{"class":998,"line":1075},[953,1253,1254],{"class":1038},"  --ui-success",[953,1256,946],{"class":1002},[953,1258,1224],{"class":1223},[953,1260,1227],{"class":1002},[953,1262,1263],{"class":1038},"--ui-color-success-500",[953,1265,1233],{"class":1002},[953,1267,1268,1271,1273,1275,1277,1280],{"class":998,"line":1102},[953,1269,1270],{"class":1038},"  --ui-info",[953,1272,946],{"class":1002},[953,1274,1224],{"class":1223},[953,1276,1227],{"class":1002},[953,1278,1279],{"class":1038},"--ui-color-info-500",[953,1281,1233],{"class":1002},[953,1283,1284,1287,1289,1291,1293,1296],{"class":998,"line":1129},[953,1285,1286],{"class":1038},"  --ui-warning",[953,1288,946],{"class":1002},[953,1290,1224],{"class":1223},[953,1292,1227],{"class":1002},[953,1294,1295],{"class":1038},"--ui-color-warning-500",[953,1297,1233],{"class":1002},[953,1299,1300,1303,1305,1307,1309,1312],{"class":998,"line":1156},[953,1301,1302],{"class":1038},"  --ui-error",[953,1304,946],{"class":1002},[953,1306,1224],{"class":1223},[953,1308,1227],{"class":1002},[953,1310,1311],{"class":1038},"--ui-color-error-500",[953,1313,1233],{"class":1002},[953,1315,1316],{"class":998,"line":1183},[953,1317,1318],{"class":1002},"}\n",[990,1320,1323],{"className":1198,"code":1321,"filename":1322,"language":1201,"meta":988,"style":988},".dark {\n  --ui-primary: var(--ui-color-primary-400);\n  --ui-secondary: var(--ui-color-secondary-400);\n  --ui-success: var(--ui-color-success-400);\n  --ui-info: var(--ui-color-info-400);\n  --ui-warning: var(--ui-color-warning-400);\n  --ui-error: var(--ui-color-error-400);\n}\n","Dark",[939,1324,1325,1336,1351,1366,1381,1396,1411,1426],{"__ignoreMap":988},[953,1326,1327,1330,1334],{"class":998,"line":999},[953,1328,1329],{"class":1002},".",[953,1331,1333],{"class":1332},"sBMFI","dark",[953,1335,1213],{"class":1002},[953,1337,1338,1340,1342,1344,1346,1349],{"class":998,"line":1012},[953,1339,1218],{"class":1038},[953,1341,946],{"class":1002},[953,1343,1224],{"class":1223},[953,1345,1227],{"class":1002},[953,1347,1348],{"class":1038},"--ui-color-primary-400",[953,1350,1233],{"class":1002},[953,1352,1353,1355,1357,1359,1361,1364],{"class":998,"line":1048},[953,1354,1238],{"class":1038},[953,1356,946],{"class":1002},[953,1358,1224],{"class":1223},[953,1360,1227],{"class":1002},[953,1362,1363],{"class":1038},"--ui-color-secondary-400",[953,1365,1233],{"class":1002},[953,1367,1368,1370,1372,1374,1376,1379],{"class":998,"line":1075},[953,1369,1254],{"class":1038},[953,1371,946],{"class":1002},[953,1373,1224],{"class":1223},[953,1375,1227],{"class":1002},[953,1377,1378],{"class":1038},"--ui-color-success-400",[953,1380,1233],{"class":1002},[953,1382,1383,1385,1387,1389,1391,1394],{"class":998,"line":1102},[953,1384,1270],{"class":1038},[953,1386,946],{"class":1002},[953,1388,1224],{"class":1223},[953,1390,1227],{"class":1002},[953,1392,1393],{"class":1038},"--ui-color-info-400",[953,1395,1233],{"class":1002},[953,1397,1398,1400,1402,1404,1406,1409],{"class":998,"line":1129},[953,1399,1286],{"class":1038},[953,1401,946],{"class":1002},[953,1403,1224],{"class":1223},[953,1405,1227],{"class":1002},[953,1407,1408],{"class":1038},"--ui-color-warning-400",[953,1410,1233],{"class":1002},[953,1412,1413,1415,1417,1419,1421,1424],{"class":998,"line":1156},[953,1414,1302],{"class":1038},[953,1416,946],{"class":1002},[953,1418,1224],{"class":1223},[953,1420,1227],{"class":1002},[953,1422,1423],{"class":1038},"--ui-color-error-400",[953,1425,1233],{"class":1002},[953,1427,1428],{"class":998,"line":1183},[953,1429,1318],{"class":1002},[1431,1432,1433,1440],"tip",{},[929,1434,1435,1436,1439],{},"You can adjust which shade each utility class uses for light and dark mode in your ",[939,1437,1438],{},"main.css"," file:",[990,1441,1444],{"className":1198,"code":1442,"filename":1443,"language":1201,"meta":988,"style":988},"@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n:root {\n  --ui-primary: var(--ui-color-primary-700);\n}\n\n.dark {\n  --ui-primary: var(--ui-color-primary-200);\n}\n","app/assets/css/main.css",[939,1445,1446,1463,1476,1481,1489,1504,1508,1512,1520,1536],{"__ignoreMap":988},[953,1447,1448,1452,1455,1458,1460],{"class":998,"line":999},[953,1449,1451],{"class":1450},"s7zQu","@import",[953,1453,1454],{"class":1002}," \"",[953,1456,1457],{"class":1030},"tailwindcss",[953,1459,1027],{"class":1002},[953,1461,1462],{"class":1002},";\n",[953,1464,1465,1467,1469,1472,1474],{"class":998,"line":1012},[953,1466,1451],{"class":1450},[953,1468,1454],{"class":1002},[953,1470,1471],{"class":1030},"@nuxt/ui",[953,1473,1027],{"class":1002},[953,1475,1462],{"class":1002},[953,1477,1478],{"class":998,"line":1048},[953,1479,1480],{"emptyLinePlaceholder":21},"\n",[953,1482,1483,1485,1487],{"class":998,"line":1075},[953,1484,946],{"class":1002},[953,1486,1210],{"class":1020},[953,1488,1213],{"class":1002},[953,1490,1491,1493,1495,1497,1499,1502],{"class":998,"line":1102},[953,1492,1218],{"class":1038},[953,1494,946],{"class":1002},[953,1496,1224],{"class":1223},[953,1498,1227],{"class":1002},[953,1500,1501],{"class":1038},"--ui-color-primary-700",[953,1503,1233],{"class":1002},[953,1505,1506],{"class":998,"line":1129},[953,1507,1318],{"class":1002},[953,1509,1510],{"class":998,"line":1156},[953,1511,1480],{"emptyLinePlaceholder":21},[953,1513,1514,1516,1518],{"class":998,"line":1183},[953,1515,1329],{"class":1002},[953,1517,1333],{"class":1332},[953,1519,1213],{"class":1002},[953,1521,1523,1525,1527,1529,1531,1534],{"class":998,"line":1522},9,[953,1524,1218],{"class":1038},[953,1526,946],{"class":1002},[953,1528,1224],{"class":1223},[953,1530,1227],{"class":1002},[953,1532,1533],{"class":1038},"--ui-color-primary-200",[953,1535,1233],{"class":1002},[953,1537,1539],{"class":998,"line":1538},10,[953,1540,1318],{"class":1002},[1542,1543,1544,1565],"warning",{},[929,1545,1546,1547,1550,1551,1558,1559,1562,1563,1439],{},"You can't use ",[939,1548,1549],{},"primary: 'black'"," in your ",[933,1552,1554],{"href":1553},"/docs/getting-started/theme/design-system#runtime-configuration",[1555,1556,1557],"strong",{},"config"," because ",[939,1560,1561],{},"black"," doesn't have multiple shades. To use solid black or white as your primary color, set it directly in your ",[939,1564,1438],{},[990,1566,1568],{"className":1198,"code":1567,"filename":1443,"language":1201,"meta":988,"style":988},"@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n:root {\n  --ui-primary: black;\n}\n\n.dark {\n  --ui-primary: white;\n}\n",[939,1569,1570,1582,1594,1598,1606,1617,1621,1625,1633,1644],{"__ignoreMap":988},[953,1571,1572,1574,1576,1578,1580],{"class":998,"line":999},[953,1573,1451],{"class":1450},[953,1575,1454],{"class":1002},[953,1577,1457],{"class":1030},[953,1579,1027],{"class":1002},[953,1581,1462],{"class":1002},[953,1583,1584,1586,1588,1590,1592],{"class":998,"line":1012},[953,1585,1451],{"class":1450},[953,1587,1454],{"class":1002},[953,1589,1471],{"class":1030},[953,1591,1027],{"class":1002},[953,1593,1462],{"class":1002},[953,1595,1596],{"class":998,"line":1048},[953,1597,1480],{"emptyLinePlaceholder":21},[953,1599,1600,1602,1604],{"class":998,"line":1075},[953,1601,946],{"class":1002},[953,1603,1210],{"class":1020},[953,1605,1213],{"class":1002},[953,1607,1608,1610,1612,1615],{"class":998,"line":1102},[953,1609,1218],{"class":1038},[953,1611,946],{"class":1002},[953,1613,1614],{"class":1038}," black",[953,1616,1462],{"class":1002},[953,1618,1619],{"class":998,"line":1129},[953,1620,1318],{"class":1002},[953,1622,1623],{"class":998,"line":1156},[953,1624,1480],{"emptyLinePlaceholder":21},[953,1626,1627,1629,1631],{"class":998,"line":1183},[953,1628,1329],{"class":1002},[953,1630,1333],{"class":1332},[953,1632,1213],{"class":1002},[953,1634,1635,1637,1639,1642],{"class":998,"line":1522},[953,1636,1218],{"class":1038},[953,1638,946],{"class":1002},[953,1640,1641],{"class":1038}," white",[953,1643,1462],{"class":1002},[953,1645,1646],{"class":998,"line":1538},[953,1647,1318],{"class":1002},[924,1649,1651],{"id":1650},"text","Text",[929,1653,1654,1655,942,1658,946],{},"Nuxt UI provides Tailwind CSS utility classes for text colors, allowing you to use class names like ",[939,1656,1657],{},"text-dimmed",[939,1659,1660],{},"text-muted",[948,1662,1663,1694],{},[929,1664,1665,1670,1674,1679,1683,1688],{},[953,1666,1669],{"className":1667},[1657,957,958,959,960,1668],"rounded-md","Dimmed",[953,1671,1673],{"className":1672},[1660,957,958,959,960,1668],"Muted",[953,1675,1678],{"className":1676},[1677,957,958,959,960,1668],"text-toned","Toned",[953,1680,1651],{"className":1681},[1682,957,958,959,960,1668],"text-default",[953,1684,1687],{"className":1685},[1686,957,958,959,960,1668],"text-highlighted","Highlighted",[953,1689,1693],{"className":1690},[1691,1692,957,958,959,960,1668],"text-inverted","bg-inverted","Inverted",[986,1695,1696],{"v-slot:code":988},[990,1697,1699],{"className":992,"code":1698,"language":34,"meta":988,"style":988},"\u003Ctemplate>\n  \u003Cspan class=\"text-dimmed\">Dimmed\u003C/span>\n  \u003Cspan class=\"text-muted\">Muted\u003C/span>\n  \u003Cspan class=\"text-toned\">Toned\u003C/span>\n  \u003Cspan class=\"text-default\">Text\u003C/span>\n  \u003Cspan class=\"text-highlighted\">Highlighted\u003C/span>\n  \u003Cspan class=\"text-inverted bg-inverted\">Inverted\u003C/span>\n\u003C/template>\n",[939,1700,1701,1709,1735,1761,1787,1813,1839,1866],{"__ignoreMap":988},[953,1702,1703,1705,1707],{"class":998,"line":999},[953,1704,1003],{"class":1002},[953,1706,986],{"class":1006},[953,1708,1009],{"class":1002},[953,1710,1711,1713,1715,1717,1719,1721,1723,1725,1727,1729,1731,1733],{"class":998,"line":1012},[953,1712,1015],{"class":1002},[953,1714,953],{"class":1006},[953,1716,1021],{"class":1020},[953,1718,1024],{"class":1002},[953,1720,1027],{"class":1002},[953,1722,1657],{"class":1030},[953,1724,1027],{"class":1002},[953,1726,1035],{"class":1002},[953,1728,1669],{"class":1038},[953,1730,1041],{"class":1002},[953,1732,953],{"class":1006},[953,1734,1009],{"class":1002},[953,1736,1737,1739,1741,1743,1745,1747,1749,1751,1753,1755,1757,1759],{"class":998,"line":1048},[953,1738,1015],{"class":1002},[953,1740,953],{"class":1006},[953,1742,1021],{"class":1020},[953,1744,1024],{"class":1002},[953,1746,1027],{"class":1002},[953,1748,1660],{"class":1030},[953,1750,1027],{"class":1002},[953,1752,1035],{"class":1002},[953,1754,1673],{"class":1038},[953,1756,1041],{"class":1002},[953,1758,953],{"class":1006},[953,1760,1009],{"class":1002},[953,1762,1763,1765,1767,1769,1771,1773,1775,1777,1779,1781,1783,1785],{"class":998,"line":1075},[953,1764,1015],{"class":1002},[953,1766,953],{"class":1006},[953,1768,1021],{"class":1020},[953,1770,1024],{"class":1002},[953,1772,1027],{"class":1002},[953,1774,1677],{"class":1030},[953,1776,1027],{"class":1002},[953,1778,1035],{"class":1002},[953,1780,1678],{"class":1038},[953,1782,1041],{"class":1002},[953,1784,953],{"class":1006},[953,1786,1009],{"class":1002},[953,1788,1789,1791,1793,1795,1797,1799,1801,1803,1805,1807,1809,1811],{"class":998,"line":1102},[953,1790,1015],{"class":1002},[953,1792,953],{"class":1006},[953,1794,1021],{"class":1020},[953,1796,1024],{"class":1002},[953,1798,1027],{"class":1002},[953,1800,1682],{"class":1030},[953,1802,1027],{"class":1002},[953,1804,1035],{"class":1002},[953,1806,1651],{"class":1038},[953,1808,1041],{"class":1002},[953,1810,953],{"class":1006},[953,1812,1009],{"class":1002},[953,1814,1815,1817,1819,1821,1823,1825,1827,1829,1831,1833,1835,1837],{"class":998,"line":1129},[953,1816,1015],{"class":1002},[953,1818,953],{"class":1006},[953,1820,1021],{"class":1020},[953,1822,1024],{"class":1002},[953,1824,1027],{"class":1002},[953,1826,1686],{"class":1030},[953,1828,1027],{"class":1002},[953,1830,1035],{"class":1002},[953,1832,1687],{"class":1038},[953,1834,1041],{"class":1002},[953,1836,953],{"class":1006},[953,1838,1009],{"class":1002},[953,1840,1841,1843,1845,1847,1849,1851,1854,1856,1858,1860,1862,1864],{"class":998,"line":1156},[953,1842,1015],{"class":1002},[953,1844,953],{"class":1006},[953,1846,1021],{"class":1020},[953,1848,1024],{"class":1002},[953,1850,1027],{"class":1002},[953,1852,1853],{"class":1030},"text-inverted bg-inverted",[953,1855,1027],{"class":1002},[953,1857,1035],{"class":1002},[953,1859,1693],{"class":1038},[953,1861,1041],{"class":1002},[953,1863,953],{"class":1006},[953,1865,1009],{"class":1002},[953,1867,1868,1870,1872],{"class":998,"line":1183},[953,1869,1041],{"class":1002},[953,1871,986],{"class":1006},[953,1873,1009],{"class":1002},[929,1875,1192],{},[1194,1877,1878,1986],{},[990,1879,1881],{"className":1198,"code":1880,"filename":1200,"language":1201,"meta":988,"style":988},":root {\n  --ui-text-dimmed: var(--ui-color-neutral-400);\n  --ui-text-muted: var(--ui-color-neutral-500);\n  --ui-text-toned: var(--ui-color-neutral-600);\n  --ui-text: var(--ui-color-neutral-700);\n  --ui-text-highlighted: var(--ui-color-neutral-900);\n  --ui-text-inverted: white;\n}\n",[939,1882,1883,1891,1907,1923,1939,1955,1971,1982],{"__ignoreMap":988},[953,1884,1885,1887,1889],{"class":998,"line":999},[953,1886,946],{"class":1002},[953,1888,1210],{"class":1020},[953,1890,1213],{"class":1002},[953,1892,1893,1896,1898,1900,1902,1905],{"class":998,"line":1012},[953,1894,1895],{"class":1038},"  --ui-text-dimmed",[953,1897,946],{"class":1002},[953,1899,1224],{"class":1223},[953,1901,1227],{"class":1002},[953,1903,1904],{"class":1038},"--ui-color-neutral-400",[953,1906,1233],{"class":1002},[953,1908,1909,1912,1914,1916,1918,1921],{"class":998,"line":1048},[953,1910,1911],{"class":1038},"  --ui-text-muted",[953,1913,946],{"class":1002},[953,1915,1224],{"class":1223},[953,1917,1227],{"class":1002},[953,1919,1920],{"class":1038},"--ui-color-neutral-500",[953,1922,1233],{"class":1002},[953,1924,1925,1928,1930,1932,1934,1937],{"class":998,"line":1075},[953,1926,1927],{"class":1038},"  --ui-text-toned",[953,1929,946],{"class":1002},[953,1931,1224],{"class":1223},[953,1933,1227],{"class":1002},[953,1935,1936],{"class":1038},"--ui-color-neutral-600",[953,1938,1233],{"class":1002},[953,1940,1941,1944,1946,1948,1950,1953],{"class":998,"line":1102},[953,1942,1943],{"class":1038},"  --ui-text",[953,1945,946],{"class":1002},[953,1947,1224],{"class":1223},[953,1949,1227],{"class":1002},[953,1951,1952],{"class":1038},"--ui-color-neutral-700",[953,1954,1233],{"class":1002},[953,1956,1957,1960,1962,1964,1966,1969],{"class":998,"line":1129},[953,1958,1959],{"class":1038},"  --ui-text-highlighted",[953,1961,946],{"class":1002},[953,1963,1224],{"class":1223},[953,1965,1227],{"class":1002},[953,1967,1968],{"class":1038},"--ui-color-neutral-900",[953,1970,1233],{"class":1002},[953,1972,1973,1976,1978,1980],{"class":998,"line":1156},[953,1974,1975],{"class":1038},"  --ui-text-inverted",[953,1977,946],{"class":1002},[953,1979,1641],{"class":1038},[953,1981,1462],{"class":1002},[953,1983,1984],{"class":998,"line":1183},[953,1985,1318],{"class":1002},[990,1987,1989],{"className":1198,"code":1988,"filename":1322,"language":1201,"meta":988,"style":988},".dark {\n  --ui-text-dimmed: var(--ui-color-neutral-500);\n  --ui-text-muted: var(--ui-color-neutral-400);\n  --ui-text-toned: var(--ui-color-neutral-300);\n  --ui-text: var(--ui-color-neutral-200);\n  --ui-text-highlighted: white;\n  --ui-text-inverted: var(--ui-color-neutral-900);\n}\n",[939,1990,1991,1999,2013,2027,2042,2057,2067,2081],{"__ignoreMap":988},[953,1992,1993,1995,1997],{"class":998,"line":999},[953,1994,1329],{"class":1002},[953,1996,1333],{"class":1332},[953,1998,1213],{"class":1002},[953,2000,2001,2003,2005,2007,2009,2011],{"class":998,"line":1012},[953,2002,1895],{"class":1038},[953,2004,946],{"class":1002},[953,2006,1224],{"class":1223},[953,2008,1227],{"class":1002},[953,2010,1920],{"class":1038},[953,2012,1233],{"class":1002},[953,2014,2015,2017,2019,2021,2023,2025],{"class":998,"line":1048},[953,2016,1911],{"class":1038},[953,2018,946],{"class":1002},[953,2020,1224],{"class":1223},[953,2022,1227],{"class":1002},[953,2024,1904],{"class":1038},[953,2026,1233],{"class":1002},[953,2028,2029,2031,2033,2035,2037,2040],{"class":998,"line":1075},[953,2030,1927],{"class":1038},[953,2032,946],{"class":1002},[953,2034,1224],{"class":1223},[953,2036,1227],{"class":1002},[953,2038,2039],{"class":1038},"--ui-color-neutral-300",[953,2041,1233],{"class":1002},[953,2043,2044,2046,2048,2050,2052,2055],{"class":998,"line":1102},[953,2045,1943],{"class":1038},[953,2047,946],{"class":1002},[953,2049,1224],{"class":1223},[953,2051,1227],{"class":1002},[953,2053,2054],{"class":1038},"--ui-color-neutral-200",[953,2056,1233],{"class":1002},[953,2058,2059,2061,2063,2065],{"class":998,"line":1129},[953,2060,1959],{"class":1038},[953,2062,946],{"class":1002},[953,2064,1641],{"class":1038},[953,2066,1462],{"class":1002},[953,2068,2069,2071,2073,2075,2077,2079],{"class":998,"line":1156},[953,2070,1975],{"class":1038},[953,2072,946],{"class":1002},[953,2074,1224],{"class":1223},[953,2076,1227],{"class":1002},[953,2078,1968],{"class":1038},[953,2080,1233],{"class":1002},[953,2082,2083],{"class":998,"line":1183},[953,2084,1318],{"class":1002},[1431,2086,2087,2092],{},[929,2088,2089,2090,1439],{},"You can customize these CSS variables in your ",[939,2091,1438],{},[990,2093,2095],{"className":1198,"code":2094,"filename":1443,"language":1201,"meta":988,"style":988},"@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n:root {\n  --ui-text: var(--ui-color-neutral-900);\n}\n\n.dark {\n  --ui-text: white;\n}\n",[939,2096,2097,2109,2121,2125,2133,2147,2151,2155,2163,2173],{"__ignoreMap":988},[953,2098,2099,2101,2103,2105,2107],{"class":998,"line":999},[953,2100,1451],{"class":1450},[953,2102,1454],{"class":1002},[953,2104,1457],{"class":1030},[953,2106,1027],{"class":1002},[953,2108,1462],{"class":1002},[953,2110,2111,2113,2115,2117,2119],{"class":998,"line":1012},[953,2112,1451],{"class":1450},[953,2114,1454],{"class":1002},[953,2116,1471],{"class":1030},[953,2118,1027],{"class":1002},[953,2120,1462],{"class":1002},[953,2122,2123],{"class":998,"line":1048},[953,2124,1480],{"emptyLinePlaceholder":21},[953,2126,2127,2129,2131],{"class":998,"line":1075},[953,2128,946],{"class":1002},[953,2130,1210],{"class":1020},[953,2132,1213],{"class":1002},[953,2134,2135,2137,2139,2141,2143,2145],{"class":998,"line":1102},[953,2136,1943],{"class":1038},[953,2138,946],{"class":1002},[953,2140,1224],{"class":1223},[953,2142,1227],{"class":1002},[953,2144,1968],{"class":1038},[953,2146,1233],{"class":1002},[953,2148,2149],{"class":998,"line":1129},[953,2150,1318],{"class":1002},[953,2152,2153],{"class":998,"line":1156},[953,2154,1480],{"emptyLinePlaceholder":21},[953,2156,2157,2159,2161],{"class":998,"line":1183},[953,2158,1329],{"class":1002},[953,2160,1333],{"class":1332},[953,2162,1213],{"class":1002},[953,2164,2165,2167,2169,2171],{"class":998,"line":1522},[953,2166,1943],{"class":1038},[953,2168,946],{"class":1002},[953,2170,1641],{"class":1038},[953,2172,1462],{"class":1002},[953,2174,2175],{"class":998,"line":1538},[953,2176,1318],{"class":1002},[924,2178,2180],{"id":2179},"background","Background",[929,2182,2183,2184,942,2187,946],{},"Nuxt UI provides Tailwind CSS utility classes for background colors, allowing you to use class names like ",[939,2185,2186],{},"bg-default",[939,2188,2189],{},"bg-muted",[948,2191,2196,2218],{"className":2192},[2193,2194,2195],"[&>div>p]:flex","[&>div>p]:flex-wrap","[&>div>p]:gap-2",[929,2197,2198,2202,2205,2210,2215],{},[953,2199,2201],{"className":2200},[2186,957,958,959,960,1668],"Default",[953,2203,1673],{"className":2204},[2189,957,958,959,960,1668],[953,2206,2209],{"className":2207},[2208,957,958,959,960,1668],"bg-elevated","Elevated",[953,2211,2214],{"className":2212},[2213,957,958,959,960,1668],"bg-accented","Accented",[953,2216,1693],{"className":2217},[1692,1691,957,958,959,960,1668],[986,2219,2220],{"v-slot:code":988},[990,2221,2223],{"className":992,"code":2222,"language":34,"meta":988,"style":988},"\u003Ctemplate>\n  \u003Cdiv class=\"bg-default\">Default\u003C/div>\n  \u003Cdiv class=\"bg-muted\">Muted\u003C/div>\n  \u003Cdiv class=\"bg-elevated\">Elevated\u003C/div>\n  \u003Cdiv class=\"bg-accented\">Accented\u003C/div>\n  \u003Cdiv class=\"bg-inverted text-inverted\">Inverted\u003C/div>\n\u003C/template>\n",[939,2224,2225,2233,2260,2286,2312,2338,2365],{"__ignoreMap":988},[953,2226,2227,2229,2231],{"class":998,"line":999},[953,2228,1003],{"class":1002},[953,2230,986],{"class":1006},[953,2232,1009],{"class":1002},[953,2234,2235,2237,2240,2242,2244,2246,2248,2250,2252,2254,2256,2258],{"class":998,"line":1012},[953,2236,1015],{"class":1002},[953,2238,2239],{"class":1006},"div",[953,2241,1021],{"class":1020},[953,2243,1024],{"class":1002},[953,2245,1027],{"class":1002},[953,2247,2186],{"class":1030},[953,2249,1027],{"class":1002},[953,2251,1035],{"class":1002},[953,2253,2201],{"class":1038},[953,2255,1041],{"class":1002},[953,2257,2239],{"class":1006},[953,2259,1009],{"class":1002},[953,2261,2262,2264,2266,2268,2270,2272,2274,2276,2278,2280,2282,2284],{"class":998,"line":1048},[953,2263,1015],{"class":1002},[953,2265,2239],{"class":1006},[953,2267,1021],{"class":1020},[953,2269,1024],{"class":1002},[953,2271,1027],{"class":1002},[953,2273,2189],{"class":1030},[953,2275,1027],{"class":1002},[953,2277,1035],{"class":1002},[953,2279,1673],{"class":1038},[953,2281,1041],{"class":1002},[953,2283,2239],{"class":1006},[953,2285,1009],{"class":1002},[953,2287,2288,2290,2292,2294,2296,2298,2300,2302,2304,2306,2308,2310],{"class":998,"line":1075},[953,2289,1015],{"class":1002},[953,2291,2239],{"class":1006},[953,2293,1021],{"class":1020},[953,2295,1024],{"class":1002},[953,2297,1027],{"class":1002},[953,2299,2208],{"class":1030},[953,2301,1027],{"class":1002},[953,2303,1035],{"class":1002},[953,2305,2209],{"class":1038},[953,2307,1041],{"class":1002},[953,2309,2239],{"class":1006},[953,2311,1009],{"class":1002},[953,2313,2314,2316,2318,2320,2322,2324,2326,2328,2330,2332,2334,2336],{"class":998,"line":1102},[953,2315,1015],{"class":1002},[953,2317,2239],{"class":1006},[953,2319,1021],{"class":1020},[953,2321,1024],{"class":1002},[953,2323,1027],{"class":1002},[953,2325,2213],{"class":1030},[953,2327,1027],{"class":1002},[953,2329,1035],{"class":1002},[953,2331,2214],{"class":1038},[953,2333,1041],{"class":1002},[953,2335,2239],{"class":1006},[953,2337,1009],{"class":1002},[953,2339,2340,2342,2344,2346,2348,2350,2353,2355,2357,2359,2361,2363],{"class":998,"line":1129},[953,2341,1015],{"class":1002},[953,2343,2239],{"class":1006},[953,2345,1021],{"class":1020},[953,2347,1024],{"class":1002},[953,2349,1027],{"class":1002},[953,2351,2352],{"class":1030},"bg-inverted text-inverted",[953,2354,1027],{"class":1002},[953,2356,1035],{"class":1002},[953,2358,1693],{"class":1038},[953,2360,1041],{"class":1002},[953,2362,2239],{"class":1006},[953,2364,1009],{"class":1002},[953,2366,2367,2369,2371],{"class":998,"line":1156},[953,2368,1041],{"class":1002},[953,2370,986],{"class":1006},[953,2372,1009],{"class":1002},[929,2374,1192],{},[1194,2376,2377,2467],{},[990,2378,2380],{"className":1198,"code":2379,"filename":1200,"language":1201,"meta":988,"style":988},":root {\n  --ui-bg: white;\n  --ui-bg-muted: var(--ui-color-neutral-50);\n  --ui-bg-elevated: var(--ui-color-neutral-100);\n  --ui-bg-accented: var(--ui-color-neutral-200);\n  --ui-bg-inverted: var(--ui-color-neutral-900);\n}\n",[939,2381,2382,2390,2401,2417,2433,2448,2463],{"__ignoreMap":988},[953,2383,2384,2386,2388],{"class":998,"line":999},[953,2385,946],{"class":1002},[953,2387,1210],{"class":1020},[953,2389,1213],{"class":1002},[953,2391,2392,2395,2397,2399],{"class":998,"line":1012},[953,2393,2394],{"class":1038},"  --ui-bg",[953,2396,946],{"class":1002},[953,2398,1641],{"class":1038},[953,2400,1462],{"class":1002},[953,2402,2403,2406,2408,2410,2412,2415],{"class":998,"line":1048},[953,2404,2405],{"class":1038},"  --ui-bg-muted",[953,2407,946],{"class":1002},[953,2409,1224],{"class":1223},[953,2411,1227],{"class":1002},[953,2413,2414],{"class":1038},"--ui-color-neutral-50",[953,2416,1233],{"class":1002},[953,2418,2419,2422,2424,2426,2428,2431],{"class":998,"line":1075},[953,2420,2421],{"class":1038},"  --ui-bg-elevated",[953,2423,946],{"class":1002},[953,2425,1224],{"class":1223},[953,2427,1227],{"class":1002},[953,2429,2430],{"class":1038},"--ui-color-neutral-100",[953,2432,1233],{"class":1002},[953,2434,2435,2438,2440,2442,2444,2446],{"class":998,"line":1102},[953,2436,2437],{"class":1038},"  --ui-bg-accented",[953,2439,946],{"class":1002},[953,2441,1224],{"class":1223},[953,2443,1227],{"class":1002},[953,2445,2054],{"class":1038},[953,2447,1233],{"class":1002},[953,2449,2450,2453,2455,2457,2459,2461],{"class":998,"line":1129},[953,2451,2452],{"class":1038},"  --ui-bg-inverted",[953,2454,946],{"class":1002},[953,2456,1224],{"class":1223},[953,2458,1227],{"class":1002},[953,2460,1968],{"class":1038},[953,2462,1233],{"class":1002},[953,2464,2465],{"class":998,"line":1156},[953,2466,1318],{"class":1002},[990,2468,2470],{"className":1198,"code":2469,"filename":1322,"language":1201,"meta":988,"style":988},".dark {\n  --ui-bg: var(--ui-color-neutral-900);\n  --ui-bg-muted: var(--ui-color-neutral-800);\n  --ui-bg-elevated: var(--ui-color-neutral-800);\n  --ui-bg-accented: var(--ui-color-neutral-700);\n  --ui-bg-inverted: white;\n}\n",[939,2471,2472,2480,2494,2509,2523,2537,2547],{"__ignoreMap":988},[953,2473,2474,2476,2478],{"class":998,"line":999},[953,2475,1329],{"class":1002},[953,2477,1333],{"class":1332},[953,2479,1213],{"class":1002},[953,2481,2482,2484,2486,2488,2490,2492],{"class":998,"line":1012},[953,2483,2394],{"class":1038},[953,2485,946],{"class":1002},[953,2487,1224],{"class":1223},[953,2489,1227],{"class":1002},[953,2491,1968],{"class":1038},[953,2493,1233],{"class":1002},[953,2495,2496,2498,2500,2502,2504,2507],{"class":998,"line":1048},[953,2497,2405],{"class":1038},[953,2499,946],{"class":1002},[953,2501,1224],{"class":1223},[953,2503,1227],{"class":1002},[953,2505,2506],{"class":1038},"--ui-color-neutral-800",[953,2508,1233],{"class":1002},[953,2510,2511,2513,2515,2517,2519,2521],{"class":998,"line":1075},[953,2512,2421],{"class":1038},[953,2514,946],{"class":1002},[953,2516,1224],{"class":1223},[953,2518,1227],{"class":1002},[953,2520,2506],{"class":1038},[953,2522,1233],{"class":1002},[953,2524,2525,2527,2529,2531,2533,2535],{"class":998,"line":1102},[953,2526,2437],{"class":1038},[953,2528,946],{"class":1002},[953,2530,1224],{"class":1223},[953,2532,1227],{"class":1002},[953,2534,1952],{"class":1038},[953,2536,1233],{"class":1002},[953,2538,2539,2541,2543,2545],{"class":998,"line":1129},[953,2540,2452],{"class":1038},[953,2542,946],{"class":1002},[953,2544,1641],{"class":1038},[953,2546,1462],{"class":1002},[953,2548,2549],{"class":998,"line":1156},[953,2550,1318],{"class":1002},[1431,2552,2553,2557],{},[929,2554,2089,2555,1439],{},[939,2556,1438],{},[990,2558,2560],{"className":1198,"code":2559,"filename":1443,"language":1201,"meta":988,"style":988},"@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n:root {\n  --ui-bg: var(--ui-color-neutral-50);\n}\n\n.dark {\n  --ui-bg: var(--ui-color-neutral-950);\n}\n",[939,2561,2562,2574,2586,2590,2598,2612,2616,2620,2628,2643],{"__ignoreMap":988},[953,2563,2564,2566,2568,2570,2572],{"class":998,"line":999},[953,2565,1451],{"class":1450},[953,2567,1454],{"class":1002},[953,2569,1457],{"class":1030},[953,2571,1027],{"class":1002},[953,2573,1462],{"class":1002},[953,2575,2576,2578,2580,2582,2584],{"class":998,"line":1012},[953,2577,1451],{"class":1450},[953,2579,1454],{"class":1002},[953,2581,1471],{"class":1030},[953,2583,1027],{"class":1002},[953,2585,1462],{"class":1002},[953,2587,2588],{"class":998,"line":1048},[953,2589,1480],{"emptyLinePlaceholder":21},[953,2591,2592,2594,2596],{"class":998,"line":1075},[953,2593,946],{"class":1002},[953,2595,1210],{"class":1020},[953,2597,1213],{"class":1002},[953,2599,2600,2602,2604,2606,2608,2610],{"class":998,"line":1102},[953,2601,2394],{"class":1038},[953,2603,946],{"class":1002},[953,2605,1224],{"class":1223},[953,2607,1227],{"class":1002},[953,2609,2414],{"class":1038},[953,2611,1233],{"class":1002},[953,2613,2614],{"class":998,"line":1129},[953,2615,1318],{"class":1002},[953,2617,2618],{"class":998,"line":1156},[953,2619,1480],{"emptyLinePlaceholder":21},[953,2621,2622,2624,2626],{"class":998,"line":1183},[953,2623,1329],{"class":1002},[953,2625,1333],{"class":1332},[953,2627,1213],{"class":1002},[953,2629,2630,2632,2634,2636,2638,2641],{"class":998,"line":1522},[953,2631,2394],{"class":1038},[953,2633,946],{"class":1002},[953,2635,1224],{"class":1223},[953,2637,1227],{"class":1002},[953,2639,2640],{"class":1038},"--ui-color-neutral-950",[953,2642,1233],{"class":1002},[953,2644,2645],{"class":998,"line":1538},[953,2646,1318],{"class":1002},[924,2648,2650],{"id":2649},"border","Border",[929,2652,2653,2654,942,2657,946],{},"Nuxt UI provides Tailwind CSS utility classes for border colors, allowing you to use class names like ",[939,2655,2656],{},"border-default",[939,2658,2659],{},"border-muted",[948,2661,2663,2680],{"className":2662},[2193,2194,2195],[929,2664,2665,2669,2672,2676],{},[953,2666,2201],{"className":2667},[2668,2656,957,958,959,960,1668],"border-2",[953,2670,1673],{"className":2671},[2668,2659,957,958,959,960,1668],[953,2673,2214],{"className":2674},[2668,2675,957,958,959,960,1668],"border-accented",[953,2677,1693],{"className":2678},[2668,2679,957,958,959,960,1668],"border-inverted",[986,2681,2682],{"v-slot:code":988},[990,2683,2685],{"className":992,"code":2684,"language":34,"meta":988,"style":988},"\u003Ctemplate>\n  \u003Cdiv class=\"border border-default\">Default\u003C/div>\n  \u003Cdiv class=\"border border-muted\">Muted\u003C/div>\n  \u003Cdiv class=\"border border-accented\">Accented\u003C/div>\n  \u003Cdiv class=\"border border-inverted\">Inverted\u003C/div>\n\u003C/template>\n",[939,2686,2687,2695,2722,2749,2776,2803],{"__ignoreMap":988},[953,2688,2689,2691,2693],{"class":998,"line":999},[953,2690,1003],{"class":1002},[953,2692,986],{"class":1006},[953,2694,1009],{"class":1002},[953,2696,2697,2699,2701,2703,2705,2707,2710,2712,2714,2716,2718,2720],{"class":998,"line":1012},[953,2698,1015],{"class":1002},[953,2700,2239],{"class":1006},[953,2702,1021],{"class":1020},[953,2704,1024],{"class":1002},[953,2706,1027],{"class":1002},[953,2708,2709],{"class":1030},"border border-default",[953,2711,1027],{"class":1002},[953,2713,1035],{"class":1002},[953,2715,2201],{"class":1038},[953,2717,1041],{"class":1002},[953,2719,2239],{"class":1006},[953,2721,1009],{"class":1002},[953,2723,2724,2726,2728,2730,2732,2734,2737,2739,2741,2743,2745,2747],{"class":998,"line":1048},[953,2725,1015],{"class":1002},[953,2727,2239],{"class":1006},[953,2729,1021],{"class":1020},[953,2731,1024],{"class":1002},[953,2733,1027],{"class":1002},[953,2735,2736],{"class":1030},"border border-muted",[953,2738,1027],{"class":1002},[953,2740,1035],{"class":1002},[953,2742,1673],{"class":1038},[953,2744,1041],{"class":1002},[953,2746,2239],{"class":1006},[953,2748,1009],{"class":1002},[953,2750,2751,2753,2755,2757,2759,2761,2764,2766,2768,2770,2772,2774],{"class":998,"line":1075},[953,2752,1015],{"class":1002},[953,2754,2239],{"class":1006},[953,2756,1021],{"class":1020},[953,2758,1024],{"class":1002},[953,2760,1027],{"class":1002},[953,2762,2763],{"class":1030},"border border-accented",[953,2765,1027],{"class":1002},[953,2767,1035],{"class":1002},[953,2769,2214],{"class":1038},[953,2771,1041],{"class":1002},[953,2773,2239],{"class":1006},[953,2775,1009],{"class":1002},[953,2777,2778,2780,2782,2784,2786,2788,2791,2793,2795,2797,2799,2801],{"class":998,"line":1102},[953,2779,1015],{"class":1002},[953,2781,2239],{"class":1006},[953,2783,1021],{"class":1020},[953,2785,1024],{"class":1002},[953,2787,1027],{"class":1002},[953,2789,2790],{"class":1030},"border border-inverted",[953,2792,1027],{"class":1002},[953,2794,1035],{"class":1002},[953,2796,1693],{"class":1038},[953,2798,1041],{"class":1002},[953,2800,2239],{"class":1006},[953,2802,1009],{"class":1002},[953,2804,2805,2807,2809],{"class":998,"line":1129},[953,2806,1041],{"class":1002},[953,2808,986],{"class":1006},[953,2810,1009],{"class":1002},[929,2812,1192],{},[1194,2814,2815,2892],{},[990,2816,2818],{"className":1198,"code":2817,"filename":1200,"language":1201,"meta":988,"style":988},":root {\n  --ui-border: var(--ui-color-neutral-200);\n  --ui-border-muted: var(--ui-color-neutral-200);\n  --ui-border-accented: var(--ui-color-neutral-300);\n  --ui-border-inverted: var(--ui-color-neutral-900);\n}\n",[939,2819,2820,2828,2843,2858,2873,2888],{"__ignoreMap":988},[953,2821,2822,2824,2826],{"class":998,"line":999},[953,2823,946],{"class":1002},[953,2825,1210],{"class":1020},[953,2827,1213],{"class":1002},[953,2829,2830,2833,2835,2837,2839,2841],{"class":998,"line":1012},[953,2831,2832],{"class":1038},"  --ui-border",[953,2834,946],{"class":1002},[953,2836,1224],{"class":1223},[953,2838,1227],{"class":1002},[953,2840,2054],{"class":1038},[953,2842,1233],{"class":1002},[953,2844,2845,2848,2850,2852,2854,2856],{"class":998,"line":1048},[953,2846,2847],{"class":1038},"  --ui-border-muted",[953,2849,946],{"class":1002},[953,2851,1224],{"class":1223},[953,2853,1227],{"class":1002},[953,2855,2054],{"class":1038},[953,2857,1233],{"class":1002},[953,2859,2860,2863,2865,2867,2869,2871],{"class":998,"line":1075},[953,2861,2862],{"class":1038},"  --ui-border-accented",[953,2864,946],{"class":1002},[953,2866,1224],{"class":1223},[953,2868,1227],{"class":1002},[953,2870,2039],{"class":1038},[953,2872,1233],{"class":1002},[953,2874,2875,2878,2880,2882,2884,2886],{"class":998,"line":1102},[953,2876,2877],{"class":1038},"  --ui-border-inverted",[953,2879,946],{"class":1002},[953,2881,1224],{"class":1223},[953,2883,1227],{"class":1002},[953,2885,1968],{"class":1038},[953,2887,1233],{"class":1002},[953,2889,2890],{"class":998,"line":1129},[953,2891,1318],{"class":1002},[990,2893,2895],{"className":1198,"code":2894,"filename":1322,"language":1201,"meta":988,"style":988},".dark {\n  --ui-border: var(--ui-color-neutral-800);\n  --ui-border-muted: var(--ui-color-neutral-700);\n  --ui-border-accented: var(--ui-color-neutral-700);\n  --ui-border-inverted: white;\n}\n",[939,2896,2897,2905,2919,2933,2947,2957],{"__ignoreMap":988},[953,2898,2899,2901,2903],{"class":998,"line":999},[953,2900,1329],{"class":1002},[953,2902,1333],{"class":1332},[953,2904,1213],{"class":1002},[953,2906,2907,2909,2911,2913,2915,2917],{"class":998,"line":1012},[953,2908,2832],{"class":1038},[953,2910,946],{"class":1002},[953,2912,1224],{"class":1223},[953,2914,1227],{"class":1002},[953,2916,2506],{"class":1038},[953,2918,1233],{"class":1002},[953,2920,2921,2923,2925,2927,2929,2931],{"class":998,"line":1048},[953,2922,2847],{"class":1038},[953,2924,946],{"class":1002},[953,2926,1224],{"class":1223},[953,2928,1227],{"class":1002},[953,2930,1952],{"class":1038},[953,2932,1233],{"class":1002},[953,2934,2935,2937,2939,2941,2943,2945],{"class":998,"line":1075},[953,2936,2862],{"class":1038},[953,2938,946],{"class":1002},[953,2940,1224],{"class":1223},[953,2942,1227],{"class":1002},[953,2944,1952],{"class":1038},[953,2946,1233],{"class":1002},[953,2948,2949,2951,2953,2955],{"class":998,"line":1102},[953,2950,2877],{"class":1038},[953,2952,946],{"class":1002},[953,2954,1641],{"class":1038},[953,2956,1462],{"class":1002},[953,2958,2959],{"class":998,"line":1129},[953,2960,1318],{"class":1002},[1431,2962,2963,2967],{},[929,2964,2089,2965,1439],{},[939,2966,1438],{},[990,2968,2970],{"className":1198,"code":2969,"filename":1443,"language":1201,"meta":988,"style":988},"@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n:root {\n  --ui-border: var(--ui-color-neutral-100);\n}\n\n.dark {\n  --ui-border: var(--ui-color-neutral-900);\n}\n",[939,2971,2972,2984,2996,3000,3008,3022,3026,3030,3038,3052],{"__ignoreMap":988},[953,2973,2974,2976,2978,2980,2982],{"class":998,"line":999},[953,2975,1451],{"class":1450},[953,2977,1454],{"class":1002},[953,2979,1457],{"class":1030},[953,2981,1027],{"class":1002},[953,2983,1462],{"class":1002},[953,2985,2986,2988,2990,2992,2994],{"class":998,"line":1012},[953,2987,1451],{"class":1450},[953,2989,1454],{"class":1002},[953,2991,1471],{"class":1030},[953,2993,1027],{"class":1002},[953,2995,1462],{"class":1002},[953,2997,2998],{"class":998,"line":1048},[953,2999,1480],{"emptyLinePlaceholder":21},[953,3001,3002,3004,3006],{"class":998,"line":1075},[953,3003,946],{"class":1002},[953,3005,1210],{"class":1020},[953,3007,1213],{"class":1002},[953,3009,3010,3012,3014,3016,3018,3020],{"class":998,"line":1102},[953,3011,2832],{"class":1038},[953,3013,946],{"class":1002},[953,3015,1224],{"class":1223},[953,3017,1227],{"class":1002},[953,3019,2430],{"class":1038},[953,3021,1233],{"class":1002},[953,3023,3024],{"class":998,"line":1129},[953,3025,1318],{"class":1002},[953,3027,3028],{"class":998,"line":1156},[953,3029,1480],{"emptyLinePlaceholder":21},[953,3031,3032,3034,3036],{"class":998,"line":1183},[953,3033,1329],{"class":1002},[953,3035,1333],{"class":1332},[953,3037,1213],{"class":1002},[953,3039,3040,3042,3044,3046,3048,3050],{"class":998,"line":1522},[953,3041,2832],{"class":1038},[953,3043,946],{"class":1002},[953,3045,1224],{"class":1223},[953,3047,1227],{"class":1002},[953,3049,1968],{"class":1038},[953,3051,1233],{"class":1002},[953,3053,3054],{"class":998,"line":1538},[953,3055,1318],{"class":1002},[924,3057,3059],{"id":3058},"radius","Radius",[929,3061,3062,3063,3066,3067,3073,3074,942,3077,946],{},"Nuxt UI overrides Tailwind CSS's default ",[939,3064,3065],{},"rounded-*"," utilities with a unified border radius system, allowing you to use regular ",[933,3068,3072],{"href":3069,"rel":3070},"https://tailwindcss.com/docs/border-radius",[3071],"nofollow","border radius utilities"," like ",[939,3075,3076],{},"rounded-xs",[939,3078,3079],{},"rounded-2xl",[948,3081,3083,3117],{"className":3082},[2193,2194,2195],[929,3084,3085,3089,3094,3098,3103,3108,3112],{},[953,3086,3088],{"className":3087},[2668,2675,957,958,959,960,3076],"xs",[953,3090,3093],{"className":3091},[2668,2675,957,958,959,960,3092],"rounded-sm","sm",[953,3095,3097],{"className":3096},[2668,2675,957,958,959,960,1668],"md",[953,3099,3102],{"className":3100},[2668,2675,957,958,959,960,3101],"rounded-lg","lg",[953,3104,3107],{"className":3105},[2668,2675,957,958,959,960,3106],"rounded-xl","xl",[953,3109,3111],{"className":3110},[2668,2675,957,958,959,960,3079],"2xl",[953,3113,3116],{"className":3114},[2668,2675,957,958,959,960,3115],"rounded-3xl","3xl",[986,3118,3119],{"v-slot:code":988},[990,3120,3122],{"className":992,"code":3121,"language":34,"meta":988,"style":988},"\u003Ctemplate>\n  \u003Cdiv class=\"rounded-xs\">xs\u003C/div>\n  \u003Cdiv class=\"rounded-sm\">sm\u003C/div>\n  \u003Cdiv class=\"rounded-md\">md\u003C/div>\n  \u003Cdiv class=\"rounded-lg\">lg\u003C/div>\n  \u003Cdiv class=\"rounded-xl\">xl\u003C/div>\n  \u003Cdiv class=\"rounded-2xl\">2xl\u003C/div>\n  \u003Cdiv class=\"rounded-3xl\">3xl\u003C/div>\n\u003C/template>\n",[939,3123,3124,3132,3158,3184,3210,3236,3262,3288,3314],{"__ignoreMap":988},[953,3125,3126,3128,3130],{"class":998,"line":999},[953,3127,1003],{"class":1002},[953,3129,986],{"class":1006},[953,3131,1009],{"class":1002},[953,3133,3134,3136,3138,3140,3142,3144,3146,3148,3150,3152,3154,3156],{"class":998,"line":1012},[953,3135,1015],{"class":1002},[953,3137,2239],{"class":1006},[953,3139,1021],{"class":1020},[953,3141,1024],{"class":1002},[953,3143,1027],{"class":1002},[953,3145,3076],{"class":1030},[953,3147,1027],{"class":1002},[953,3149,1035],{"class":1002},[953,3151,3088],{"class":1038},[953,3153,1041],{"class":1002},[953,3155,2239],{"class":1006},[953,3157,1009],{"class":1002},[953,3159,3160,3162,3164,3166,3168,3170,3172,3174,3176,3178,3180,3182],{"class":998,"line":1048},[953,3161,1015],{"class":1002},[953,3163,2239],{"class":1006},[953,3165,1021],{"class":1020},[953,3167,1024],{"class":1002},[953,3169,1027],{"class":1002},[953,3171,3092],{"class":1030},[953,3173,1027],{"class":1002},[953,3175,1035],{"class":1002},[953,3177,3093],{"class":1038},[953,3179,1041],{"class":1002},[953,3181,2239],{"class":1006},[953,3183,1009],{"class":1002},[953,3185,3186,3188,3190,3192,3194,3196,3198,3200,3202,3204,3206,3208],{"class":998,"line":1075},[953,3187,1015],{"class":1002},[953,3189,2239],{"class":1006},[953,3191,1021],{"class":1020},[953,3193,1024],{"class":1002},[953,3195,1027],{"class":1002},[953,3197,1668],{"class":1030},[953,3199,1027],{"class":1002},[953,3201,1035],{"class":1002},[953,3203,3097],{"class":1038},[953,3205,1041],{"class":1002},[953,3207,2239],{"class":1006},[953,3209,1009],{"class":1002},[953,3211,3212,3214,3216,3218,3220,3222,3224,3226,3228,3230,3232,3234],{"class":998,"line":1102},[953,3213,1015],{"class":1002},[953,3215,2239],{"class":1006},[953,3217,1021],{"class":1020},[953,3219,1024],{"class":1002},[953,3221,1027],{"class":1002},[953,3223,3101],{"class":1030},[953,3225,1027],{"class":1002},[953,3227,1035],{"class":1002},[953,3229,3102],{"class":1038},[953,3231,1041],{"class":1002},[953,3233,2239],{"class":1006},[953,3235,1009],{"class":1002},[953,3237,3238,3240,3242,3244,3246,3248,3250,3252,3254,3256,3258,3260],{"class":998,"line":1129},[953,3239,1015],{"class":1002},[953,3241,2239],{"class":1006},[953,3243,1021],{"class":1020},[953,3245,1024],{"class":1002},[953,3247,1027],{"class":1002},[953,3249,3106],{"class":1030},[953,3251,1027],{"class":1002},[953,3253,1035],{"class":1002},[953,3255,3107],{"class":1038},[953,3257,1041],{"class":1002},[953,3259,2239],{"class":1006},[953,3261,1009],{"class":1002},[953,3263,3264,3266,3268,3270,3272,3274,3276,3278,3280,3282,3284,3286],{"class":998,"line":1156},[953,3265,1015],{"class":1002},[953,3267,2239],{"class":1006},[953,3269,1021],{"class":1020},[953,3271,1024],{"class":1002},[953,3273,1027],{"class":1002},[953,3275,3079],{"class":1030},[953,3277,1027],{"class":1002},[953,3279,1035],{"class":1002},[953,3281,3111],{"class":1038},[953,3283,1041],{"class":1002},[953,3285,2239],{"class":1006},[953,3287,1009],{"class":1002},[953,3289,3290,3292,3294,3296,3298,3300,3302,3304,3306,3308,3310,3312],{"class":998,"line":1183},[953,3291,1015],{"class":1002},[953,3293,2239],{"class":1006},[953,3295,1021],{"class":1020},[953,3297,1024],{"class":1002},[953,3299,1027],{"class":1002},[953,3301,3115],{"class":1030},[953,3303,1027],{"class":1002},[953,3305,1035],{"class":1002},[953,3307,3116],{"class":1038},[953,3309,1041],{"class":1002},[953,3311,2239],{"class":1006},[953,3313,1009],{"class":1002},[953,3315,3316,3318,3320],{"class":998,"line":1522},[953,3317,1041],{"class":1002},[953,3319,986],{"class":1006},[953,3321,1009],{"class":1002},[929,3323,3324,3325,3328],{},"These utility classes are calculated based on a global ",[939,3326,3327],{},"--ui-radius"," CSS variable, which defines the base radius value applied across all components for a consistent look.",[990,3330,3332],{"className":1198,"code":3331,"language":1201,"meta":988,"style":988},":root {\n  --ui-radius: 0.25rem;\n}\n",[939,3333,3334,3342,3355],{"__ignoreMap":988},[953,3335,3336,3338,3340],{"class":998,"line":999},[953,3337,946],{"class":1002},[953,3339,1210],{"class":1020},[953,3341,1213],{"class":1002},[953,3343,3344,3347,3349,3353],{"class":998,"line":1012},[953,3345,3346],{"class":1038},"  --ui-radius",[953,3348,946],{"class":1002},[953,3350,3352],{"class":3351},"sbssI"," 0.25rem",[953,3354,1462],{"class":1002},[953,3356,3357],{"class":998,"line":1048},[953,3358,1318],{"class":1002},[1431,3360,3361,3366],{},[929,3362,3363,3364,1439],{},"You can customize the base radius value in your ",[939,3365,1438],{},[990,3367,3369],{"className":1198,"code":3368,"filename":1443,"language":1201,"meta":988,"style":988},"@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n:root {\n  --ui-radius: 0.5rem;\n}\n",[939,3370,3371,3383,3395,3399,3407,3418],{"__ignoreMap":988},[953,3372,3373,3375,3377,3379,3381],{"class":998,"line":999},[953,3374,1451],{"class":1450},[953,3376,1454],{"class":1002},[953,3378,1457],{"class":1030},[953,3380,1027],{"class":1002},[953,3382,1462],{"class":1002},[953,3384,3385,3387,3389,3391,3393],{"class":998,"line":1012},[953,3386,1451],{"class":1450},[953,3388,1454],{"class":1002},[953,3390,1471],{"class":1030},[953,3392,1027],{"class":1002},[953,3394,1462],{"class":1002},[953,3396,3397],{"class":998,"line":1048},[953,3398,1480],{"emptyLinePlaceholder":21},[953,3400,3401,3403,3405],{"class":998,"line":1075},[953,3402,946],{"class":1002},[953,3404,1210],{"class":1020},[953,3406,1213],{"class":1002},[953,3408,3409,3411,3413,3416],{"class":998,"line":1102},[953,3410,3346],{"class":1038},[953,3412,946],{"class":1002},[953,3414,3415],{"class":3351}," 0.5rem",[953,3417,1462],{"class":1002},[953,3419,3420],{"class":998,"line":1129},[953,3421,1318],{"class":1002},[3423,3424,3425],"note",{},[929,3426,3427,3428,3432],{},"Try the ",[3429,3430],"prose-icon",{"className":3431,"name":69},[956]," theme picker in the header above to change the base radius value.",[924,3434,336],{"id":3435},"container",[929,3437,3438,3439,3442,3443,3445],{},"Nuxt UI provides a ",[939,3440,3441],{},"--ui-container"," CSS variable that controls the maximum width of the ",[933,3444,336],{"href":337}," component.",[990,3447,3449],{"className":1198,"code":3448,"language":1201,"meta":988,"style":988},":root {\n  --ui-container: 80rem; /* var(--container-7xl) */\n}\n",[939,3450,3451,3459,3476],{"__ignoreMap":988},[953,3452,3453,3455,3457],{"class":998,"line":999},[953,3454,946],{"class":1002},[953,3456,1210],{"class":1020},[953,3458,1213],{"class":1002},[953,3460,3461,3464,3466,3469,3472],{"class":998,"line":1012},[953,3462,3463],{"class":1038},"  --ui-container",[953,3465,946],{"class":1002},[953,3467,3468],{"class":3351}," 80rem",[953,3470,3471],{"class":1002},";",[953,3473,3475],{"class":3474},"sHwdD"," /* var(--container-7xl) */\n",[953,3477,3478],{"class":998,"line":1048},[953,3479,1318],{"class":1002},[1431,3481,3482,3488],{},[929,3483,3484,3485,3487],{},"You can customize this value in your ",[939,3486,1438],{}," file to adjust container widths consistently throughout your application:",[990,3489,3491],{"className":1198,"code":3490,"filename":1443,"language":1201,"meta":988,"style":988},"@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n@theme {\n  --container-8xl: 90rem;\n}\n\n:root {\n  --ui-container: var(--container-8xl);\n}\n",[939,3492,3493,3505,3517,3521,3528,3533,3537,3541,3549,3564],{"__ignoreMap":988},[953,3494,3495,3497,3499,3501,3503],{"class":998,"line":999},[953,3496,1451],{"class":1450},[953,3498,1454],{"class":1002},[953,3500,1457],{"class":1030},[953,3502,1027],{"class":1002},[953,3504,1462],{"class":1002},[953,3506,3507,3509,3511,3513,3515],{"class":998,"line":1012},[953,3508,1451],{"class":1450},[953,3510,1454],{"class":1002},[953,3512,1471],{"class":1030},[953,3514,1027],{"class":1002},[953,3516,1462],{"class":1002},[953,3518,3519],{"class":998,"line":1048},[953,3520,1480],{"emptyLinePlaceholder":21},[953,3522,3523,3526],{"class":998,"line":1075},[953,3524,3525],{"class":1450},"@theme",[953,3527,1213],{"class":1002},[953,3529,3530],{"class":998,"line":1102},[953,3531,3532],{"class":1038},"  --container-8xl: 90rem;\n",[953,3534,3535],{"class":998,"line":1129},[953,3536,1318],{"class":1038},[953,3538,3539],{"class":998,"line":1156},[953,3540,1480],{"emptyLinePlaceholder":21},[953,3542,3543,3545,3547],{"class":998,"line":1183},[953,3544,946],{"class":1002},[953,3546,1210],{"class":1020},[953,3548,1213],{"class":1002},[953,3550,3551,3553,3555,3557,3559,3562],{"class":998,"line":1522},[953,3552,3463],{"class":1038},[953,3554,946],{"class":1002},[953,3556,1224],{"class":1223},[953,3558,1227],{"class":1002},[953,3560,3561],{"class":1038},"--container-8xl",[953,3563,1233],{"class":1002},[953,3565,3566],{"class":998,"line":1538},[953,3567,1318],{"class":1002},[924,3569,506],{"id":3570},"header",[929,3572,3438,3573,3576,3577,3445],{},[939,3574,3575],{},"--ui-header-height"," CSS variable that controls the height of the ",[933,3578,506],{"href":507},[990,3580,3582],{"className":1198,"code":3581,"language":1201,"meta":988,"style":988},":root {\n  --ui-header-height: --spacing(16);\n}\n",[939,3583,3584,3592,3610],{"__ignoreMap":988},[953,3585,3586,3588,3590],{"class":998,"line":999},[953,3587,946],{"class":1002},[953,3589,1210],{"class":1020},[953,3591,1213],{"class":1002},[953,3593,3594,3597,3599,3602,3605,3608],{"class":998,"line":1012},[953,3595,3596],{"class":1038},"  --ui-header-height",[953,3598,946],{"class":1002},[953,3600,3601],{"class":1038}," --spacing(",[953,3603,3604],{"class":3351},"16",[953,3606,3607],{"class":1038},")",[953,3609,1462],{"class":1002},[953,3611,3612],{"class":998,"line":1048},[953,3613,1318],{"class":1002},[1431,3615,3616,3621],{},[929,3617,3484,3618,3620],{},[939,3619,1438],{}," to adjust header height consistently throughout your application:",[990,3622,3624],{"className":1198,"code":3623,"filename":1443,"language":1201,"meta":988,"style":988},"@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n:root {\n  --ui-header-height: --spacing(24);\n}\n",[939,3625,3626,3638,3650,3654,3662,3677],{"__ignoreMap":988},[953,3627,3628,3630,3632,3634,3636],{"class":998,"line":999},[953,3629,1451],{"class":1450},[953,3631,1454],{"class":1002},[953,3633,1457],{"class":1030},[953,3635,1027],{"class":1002},[953,3637,1462],{"class":1002},[953,3639,3640,3642,3644,3646,3648],{"class":998,"line":1012},[953,3641,1451],{"class":1450},[953,3643,1454],{"class":1002},[953,3645,1471],{"class":1030},[953,3647,1027],{"class":1002},[953,3649,1462],{"class":1002},[953,3651,3652],{"class":998,"line":1048},[953,3653,1480],{"emptyLinePlaceholder":21},[953,3655,3656,3658,3660],{"class":998,"line":1075},[953,3657,946],{"class":1002},[953,3659,1210],{"class":1020},[953,3661,1213],{"class":1002},[953,3663,3664,3666,3668,3670,3673,3675],{"class":998,"line":1102},[953,3665,3596],{"class":1038},[953,3667,946],{"class":1002},[953,3669,3601],{"class":1038},[953,3671,3672],{"class":3351},"24",[953,3674,3607],{"class":1038},[953,3676,1462],{"class":1002},[953,3678,3679],{"class":998,"line":1129},[953,3680,1318],{"class":1002},[924,3682,3684],{"id":3683},"body","Body",[929,3686,3687,3688,3698],{},"Nuxt UI applies default classes on the ",[939,3689,3692,3694,3696],{"className":3690,"language":3691,"style":988},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","html",[953,3693,1003],{"class":1002},[953,3695,3683],{"class":1006},[953,3697,1035],{"class":1002}," element of your app for consistent theming across light and dark modes:",[990,3700,3702],{"className":1198,"code":3701,"language":1201,"meta":988,"style":988},"body {\n  @apply antialiased text-default bg-default scheme-light dark:scheme-dark;\n}\n",[939,3703,3704,3710,3722],{"__ignoreMap":988},[953,3705,3706,3708],{"class":998,"line":999},[953,3707,3683],{"class":1332},[953,3709,1213],{"class":1002},[953,3711,3712,3715,3717,3720],{"class":998,"line":1012},[953,3713,3714],{"class":1038},"  @apply antialiased text-default bg-default scheme-light dark",[953,3716,946],{"class":1002},[953,3718,3719],{"class":1038},"scheme-dark",[953,3721,1462],{"class":1002},[953,3723,3724],{"class":998,"line":1048},[953,3725,1318],{"class":1002},[3727,3728,3729],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}",{"title":988,"searchDepth":1012,"depth":1012,"links":3731},[3732,3733,3734,3735,3736,3737,3738,3739],{"id":926,"depth":1012,"text":927},{"id":1650,"depth":1012,"text":1651},{"id":2179,"depth":1012,"text":2180},{"id":2649,"depth":1012,"text":2650},{"id":3058,"depth":1012,"text":3059},{"id":3435,"depth":1012,"text":336},{"id":3570,"depth":1012,"text":506},{"id":3683,"depth":1012,"text":3684},{},{"icon":69},{"title":65,"description":68},"_HjFc6DrOkhxXUEsy-HvDx2_SDwx7JN__FRBGczVkBc",{"data":3745,"body":3746},{},{"type":1210,"children":3747},[3748],{"type":172,"tag":929,"props":3749,"children":3750},{},[3751],{"type":1650,"value":68},1769700079635]