nuxt-ui-pro · HugoRCD · Aug 18, 2025 · Aug 20, 2025
diff --git a/.env.example b/.env.example
diff --git a/README.md b/README.md
@@ -1,11 +1,11 @@
 # Vue Starter Template
 
-[![Nuxt UI Pro](https://img.shields.io/badge/Made%20with-Nuxt%20UI%20Pro-00DC82?logo=nuxt&labelColor=020420)](https://ui.nuxt.com/pro)
+[![Nuxt UI](https://img.shields.io/badge/Made%20with-Nuxt%20UI-00DC82?logo=nuxt&labelColor=020420)](https://ui.nuxt.com)
 
-This Vue starter lets you get started with [Nuxt UI Pro](https://ui.nuxt.com/pro) quickly.
+This Vue starter lets you get started with [Nuxt UI](https://ui.nuxt.com) quickly.
 
 - [Live demo](https://ui-pro-starter-vue.nuxt.dev/)
-- [Documentation](https://ui.nuxt.com/getting-started/installation/pro/vue)
+- [Documentation](https://ui.nuxt.com/getting-started/installation/vue)
 
 ## Setup
 

diff --git a/index.html b/index.html
@@ -7,7 +7,7 @@
     <link rel="preconnect" href="https://fonts.bunny.net">
     <link href="https://fonts.bunny.net/css?family=public-sans:400,500,600,700" rel="stylesheet" />
     <title>Vue Starter Template</title>
-    <meta name="description" content="Nuxt UI Pro is a collection of premium Vue components built on top of Nuxt UI to create beautiful & responsive Nuxt applications in minutes.">
+    <meta name="description" content="Nuxt UI is a free and open-source UI library for Nuxt applications. Create beautiful & responsive applications in minutes.">
   </head>
   <body>
     <div id="app" class="isolate"></div>

diff --git a/package.json b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "nuxt-ui-pro-starter-vue",
+  "name": "nuxt-ui-starter-vue",
   "private": true,
   "type": "module",
   "scripts": {
@@ -10,7 +10,7 @@
     "typecheck": "vue-tsc -p ./tsconfig.app.json"
   },
   "dependencies": {
-    "@nuxt/ui-pro": "^3.2.0",
+    "@nuxt/ui": "^4.0.0-alpha.0",
     "vue": "^3.5.17",
     "vue-router": "^4.5.1"
   },
@@ -33,4 +33,4 @@
     ]
   },
   "packageManager": "[email protected]"
-}
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/App.vue b/src/App.vue
@@ -4,12 +4,12 @@
       <UHeader>
         <template #left>
           <RouterLink to="/">
-            <LogoPro class="w-auto h-6 shrink-0" />
+            <UILogo class="w-auto h-6 shrink-0" />
           </RouterLink>
         </template>
 
         <template #right>
-          <UColorModeButton />
+          <!-- <UColorModeButton /> -->
 
           <UButton
             to="https://github.com/nuxt-ui-pro/starter-vue"

diff --git a/src/assets/css/main.css b/src/assets/css/main.css
@@ -1,5 +1,5 @@
 @import "tailwindcss";
-@import "@nuxt/ui-pro";
+@import "@nuxt/ui";
 
 @theme static {
   --font-sans: 'Public Sans', sans-serif;

diff --git a/src/components/LogoPro.vue b/src/components/LogoPro.vue
diff --git a/src/components/UILogo.vue b/src/components/UILogo.vue
@@ -0,0 +1,44 @@
+<template>
+  <svg
+    width="113"
+    height="22"
+    viewBox="0 0 113 22"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M35.24 22C35.4992 22 35.72 21.7851 35.72 21.52V10.36C35.72 10.36 36.32 11.44 37.4 13.24L42.08 21.28C42.2942 21.7288 42.7692 22 43.16 22H46.4V4H43.16C42.9442 4 42.68 4.1793 42.68 4.48V15.76L40.52 11.92L36.2 4.6C35.9898 4.22695 35.5374 4 35.12 4H32V22H35.24Z"
+      fill="currentColor"
+    />
+    <path
+      d="M77.12 9.04H78.68C79.0776 9.04 79.4 8.71764 79.4 8.32V5.2H82.76V9.04H86V11.92H82.76V17.08C82.76 18.34 83.3669 18.88 84.44 18.88H86V22H83.96C81.1937 22 79.4 20.2086 79.4 17.2V11.92H77.12V9.04Z"
+      fill="currentColor"
+    />
+    <path
+      d="M60.92 9.04V16.48C60.92 18.1604 60.2891 19.5771 59.36 20.56C58.4309 21.5429 57.1479 22 55.4 22C53.6521 22 52.2491 21.5429 51.32 20.56C50.4067 19.5771 49.76 18.1604 49.76 16.48V9.04H51.68C52.0894 9.04 52.4923 9.11464 52.76 9.4C53.0277 9.6695 53.12 9.82782 53.12 10.24V16.48C53.12 17.447 53.1748 18.0444 53.6 18.52C54.0252 18.9797 54.5496 19.12 55.4 19.12C56.2661 19.12 56.6548 18.9797 57.08 18.52C57.5052 18.0444 57.56 17.447 57.56 16.48V10.24C57.56 9.82782 57.6523 9.56535 57.92 9.28C58.1552 9.02928 58.4033 9.03519 58.76 9.04C58.8093 9.04066 58.9503 9.04 59 9.04H60.92Z"
+      fill="currentColor"
+    />
+    <path
+      d="M71.12 15.28L75.2 9.04H72.08C71.6868 9.04 71.3374 9.18109 71.12 9.52L69.2 12.4L67.4 9.64C67.1826 9.30109 66.7132 9.04 66.32 9.04H63.32L67.4 15.16L62.96 22H66.08C66.47 22 66.8219 21.6145 67.04 21.28L69.2 18.04L71.48 21.4C71.6981 21.7345 72.0499 22 72.44 22H75.56L71.12 15.28Z"
+      fill="currentColor"
+    />
+    <path
+      d="M104.96 5.20001H102.56C102.023 5.20001 101.591 5.19273 101.24 5.56C100.889 5.90686 101 6.1095 101 6.64V14.92C101 16.1646 100.838 16.8279 100.28 17.44C99.7222 18.0317 99.0161 18.28 97.88 18.28C96.7645 18.28 95.9177 18.0317 95.36 17.44C94.8022 16.8279 94.76 16.1646 94.76 14.92V6.64001C94.76 6.10951 94.7511 5.90687 94.4 5.56001C94.0488 5.19274 93.617 5.20001 93.08 5.20001H90.8V14.92C90.8 17.0828 91.4019 18.815 92.6 20.08C93.8187 21.345 95.5871 22 97.88 22C100.173 22 101.941 21.345 103.16 20.08C104.379 18.815 104.96 17.0828 104.96 14.92V5.20001Z"
+      fill="var(--ui-primary)"
+    />
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M110 5.20279L112.4 5.2V7.24L112.4 13.36V16.7209L112.4 19.72L112.4 20.6804C112.4 21.1525 112.398 21.3314 112.04 21.6401C111.682 21.967 111.148 22 110.6 22H108.32V19.7208L108.32 13.6014V6.40258C108.32 5.93891 108.322 5.74593 108.68 5.44276C109.018 5.1563 109.452 5.20279 110 5.20279Z"
+      fill="var(--ui-primary)"
+    />
+    <path
+      d="M0 0L13 22L26 0H20.8L13 13.2L5.135 0H0Z"
+      fill="var(--ui-primary)"
+    />
+    <path
+      d="M5.135 0L13 13.2638L20.8 0H15.99L13 5.10145L9.945 0H5.135Z"
+      fill="#35495E"
+    />
+  </svg>
+</template>
diff --git a/src/pages/index.vue b/src/pages/index.vue
@@ -1,11 +1,11 @@
 <template>
   <div>
     <UPageHero
-      title="Nuxt UI Pro - Vue Starter"
-      description="Nuxt UI Pro is a collection of premium components built on top of Nuxt UI to create beautiful & responsive applications in minutes."
+      title="Nuxt UI - Vue Starter"
+      description="Nuxt UI is a free and open-source UI library for Nuxt applications. Create beautiful & responsive applications in minutes."
       :links="[{
         label: 'Get started',
-        to: 'https://ui.nuxt.com/getting-started/installation/pro/vue',
+        to: 'https://ui.nuxt.com/getting-started/installation/vue',
         target: '_blank',
         trailingIcon: 'i-lucide-arrow-right',
         size: 'xl'
@@ -23,11 +23,11 @@
     <UPageSection
       id="features"
       title="The freedom to build anything"
-      description="Nuxt UI Pro ships with an extensive set of advanced components that cover a wide range of use-cases. Carefully crafted to reduce boilerplate code without sacrificing flexibility."
+      description="Nuxt UI ships with a comprehensive set of components that cover a wide range of use-cases. Carefully crafted to reduce boilerplate code without sacrificing flexibility."
       :features="[{
         icon: 'i-lucide-wrench',
         title: 'Fully customizable',
-        description: 'Customize any component through the App Config or fine-tune specific instances with the ui prop, just like Nuxt UI.'
+        description: 'Customize any component through the App Config or fine-tune specific instances with the ui prop for maximum flexibility.'
       }, {
         icon: 'i-lucide-square-stack',
         title: 'Powerful slot system',
@@ -41,20 +41,20 @@
 
     <UPageSection>
       <UPageCTA
-        title="Start with Nuxt UI Pro today!"
-        description="Nuxt UI Pro is free in development, but you need a license to use it in production."
+        title="Start with Nuxt UI today!"
+        description="Nuxt UI is a free and open-source UI library for Nuxt applications."
         variant="subtle"
         :links="[{
-          label: 'Buy now',
-          to: 'https://ui.nuxt.com/pro/purchase',
+          label: 'Get started',
+          to: 'https://ui.nuxt.com/getting-started/installation/vue',
           target: '_blank',
-          icon: 'i-lucide-shopping-cart',
+          icon: 'i-lucide-arrow-right',
           color: 'neutral'
         }, {
-          label: 'License',
-          to: 'https://ui.nuxt.com/getting-started/license',
+          label: 'GitHub',
+          to: 'https://github.com/nuxt-ui-pro/starter-vue',
           target: '_blank',
-          trailingIcon: 'i-lucide-circle-help',
+          trailingIcon: 'simple-icons:github',
           color: 'neutral',
           variant: 'subtle'
         }]"

diff --git a/vite.config.ts b/vite.config.ts
@@ -1,12 +1,12 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
-import uiPro from '@nuxt/ui-pro/vite'
+import ui from '@nuxt/ui/vite'
 
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [
     vue(),
-    uiPro({
+    ui({
       ui: {
         colors: {
           primary: 'green',