Nuxt UI Pro is a collection of Vue components, composables and utils built on top of Nuxt UI, oriented on structure and layout and designed to be used as building blocks for your app.
[!NOTE] You are on the
v3
development branch, check out the v1 branch for Nuxt UI Pro v1.
You can get started with our minimal starter, one of our official templates or follow the Installation guide to install Nuxt UI Pro in your existing project.
pnpm add @nuxt/ui-pro
yarn add @nuxt/ui-pro
npm install @nuxt/ui-pro
bun add @nuxt/ui-pro
- Add the Nuxt UI module in your
nuxt.config.ts
:
export default defineNuxtConfig({
modules: ['@nuxt/ui-pro']
})
- Import Tailwind CSS and Nuxt UI in your CSS:
@import "tailwindcss";
@import "@nuxt/ui-pro";
Learn more in the installation guide.
Nuxt UI Pro is free in development, but you need a license to use it in production. You can choose between Solo and Team, both will give you access to the same features and give you a license key required to build your apps. The main difference is the number of developers that can be invited to the private GitHub repository.
Once you've purchased Nuxt UI Pro, you will receive an email with a license key to activate. Visit https://ui.nuxt.com/pro/activate to activate your license with your GitHub username and license key, you will be invited to the private GitHub repository.
Then, use your license key in your .env
file:
# .env
NUXT_UI_PRO_LICENSE=<your-license-key>
If you have multiple projects on your machine, you can also add it to your ~/.nuxtrc
:
uiPro.license=<your-token>
Here are some open-source projects using Nuxt UI Pro:
When using the Nuxt Devtools, you can see the list of components injected by Nuxt UI Pro in the "Components' tab:
In progress. You cannot repackage Nuxt UI Pro or copy/paste the components into premium templates, UI libraries or open source projects.