diff --git a/docs/app/pages/.index.yml b/docs/app/pages/.index.yml
index ac32c881..67d8896c 100644
--- a/docs/app/pages/.index.yml
+++ b/docs/app/pages/.index.yml
@@ -5,7 +5,17 @@ hero:
description: Create beautiful, responsive & accessible web apps quickly with Vue or Nuxt. Nuxt UI is an open-source UI library of 50+ customizable components built with Tailwind CSS and Reka UI.
links:
- label: Get started
- to: /getting-started/installation
+ to: /getting-started/installation/nuxt
+ class: 'ui-only nuxt-only'
+ - label: Get started
+ to: /getting-started/installation/vue
+ class: 'ui-only vue-only'
+ - label: Get started
+ to: /getting-started/installation/pro/nuxt
+ class: 'ui-pro-only nuxt-only'
+ - label: Get started
+ to: /getting-started/installation/pro/vue
+ class: 'ui-pro-only vue-only'
- label: Explore components
to: /components
variant: outline
@@ -50,7 +60,7 @@ design_system:
title: Flexible design system
description: Build your next project faster with Nuxt UI's comprehensive design system. Featuring semantic color aliases, comprehensive design tokens, and automatic light/dark mode support for accessible components out of the box.
links:
- - label: Learn more
+ - label: Customize design system
to: /getting-started/theme#design-system
variant: outline
color: neutral
@@ -107,7 +117,7 @@ component_customization:
title: Powerful component customization
description: Nuxt UI leverages [Tailwind Variants](https://www.tailwind-variants.org/) to provide a powerful, maintainable system for managing component styles and intelligently merging Tailwind CSS classes without conflicts.
links:
- - label: Learn more
+ - label: Customize components
to: /getting-started/theme#customize-theme
variant: outline
color: neutral
diff --git a/docs/app/pages/figma/.figma.yml b/docs/app/pages/figma/.figma.yml
index 60f33929..178fef53 100644
--- a/docs/app/pages/figma/.figma.yml
+++ b/docs/app/pages/figma/.figma.yml
@@ -8,7 +8,6 @@ hero:
links:
- label: Purchase Pro Kit
to: 'https://nuxt.lemonsqueezy.com/buy/17213c49-621b-4c2c-9478-3a50a099003d'
- trailing-icon: i-lucide-arrow-right
target: _blank
- label: Free Figma Kit
to: 'https://go.nuxt.com/figma'
@@ -121,7 +120,6 @@ section4:
links:
- label: Get access now
to: 'https://nuxt.lemonsqueezy.com/buy/17213c49-621b-4c2c-9478-3a50a099003d'
- trailing-icon: i-lucide-arrow-right
- label: Preview UI Pro Design Kit
to: 'https://go.nuxt.com/figma-pro'
icon: i-logos-figma
diff --git a/docs/app/pages/pro/.content/pricing.yml b/docs/app/pages/pro/.content/pricing.yml
index 9a5bd887..c72439ec 100644
--- a/docs/app/pages/pro/.content/pricing.yml
+++ b/docs/app/pages/pro/.content/pricing.yml
@@ -29,7 +29,7 @@ pricing:
- Free [preview available](https://www.figma.com/design/mxXR9binOSLU3rYKZZRPXs/PREVIEW---NuxtUIPro-V3-BETA?m=auto&t=c4598Wr0rZwKPs5M-1)
- Includes Nuxt UI [Figma Kit](https://www.figma.com/community/file/1288455405058138934)
button:
- label: Explore Figma Kit Pricing
+ label: Buy Figma Kit
to: 'https://nuxt.lemonsqueezy.com/buy/17213c49-621b-4c2c-9478-3a50a099003d'
color: 'neutral'
plans:
diff --git a/docs/app/pages/pro/.content/pro.yml b/docs/app/pages/pro/.content/pro.yml
index 0e82a4bb..8a957082 100644
--- a/docs/app/pages/pro/.content/pro.yml
+++ b/docs/app/pages/pro/.content/pro.yml
@@ -7,13 +7,13 @@ hero:
- label: Buy a license
size: xl
to: /pro/pricing
- trailing-icon: i-lucide-arrow-right
- - label: Get started
+ - label: Try for free
trailing: true
color: neutral
- variant: ghost
+ variant: outline
to: /getting-started/installation/pro/nuxt
size: xl
+ trailingIcon: i-lucide-arrow-right
features:
title: Create stunning Vue applications faster.
description: Nuxt UI Pro comes packed with powerful features to help you build modern, performant, accessible and responsive Nuxt applications at record speed. From pre-built UI sections to Figma design kits, every detail is crafted to speed up your development and deliver a polished user experience.
@@ -157,8 +157,8 @@ cta:
links:
- label: Buy a license
to: '/pro/pricing'
- trailing-icon: i-lucide-arrow-right
- - label: Get started
- to: '/getting-started/license'
- variant: ghost
+ - label: Try for free
+ to: /getting-started/installation/pro/nuxt
+ variant: outline
color: neutral
+ trailingIcon: i-lucide-arrow-right
diff --git a/docs/app/pages/pro/.content/templates.yml b/docs/app/pages/pro/.content/templates.yml
index eddf7c67..bd5bf746 100644
--- a/docs/app/pages/pro/.content/templates.yml
+++ b/docs/app/pages/pro/.content/templates.yml
@@ -5,16 +5,16 @@ hero:
description: 'Ready to use templates powered by our premium Vue components and Nuxt Content.
The templates are responsive, accessible and easy to customize so you can get started in no time.'
navigation: false
links:
- - label: Get started
- to: /getting-started/installation/pro/nuxt#use-an-official-template
- color: neutral
+ - label: Buy a license
+ color: primary
size: xl
- trailingIcon: i-lucide-arrow-right
- - label: Purchase a license
+ to: /pro/pricing
+ - label: Try for free
+ to: /getting-started/installation/pro/nuxt#use-an-official-template
size: xl
color: neutral
variant: outline
- to: /pro/pricing
+ trailingIcon: i-lucide-arrow-right
templates:
- title: 'Dashboard'
description: "A template to illustrate how to build your own dashboard with the 15+ latest Nuxt UI Pro components, designed specifically to create a consistent look and feel."
diff --git a/docs/app/pages/pro/index.vue b/docs/app/pages/pro/index.vue
index 8c376f5e..55c7df5e 100644
--- a/docs/app/pages/pro/index.vue
+++ b/docs/app/pages/pro/index.vue
@@ -116,7 +116,7 @@ useSeoMeta({
wrapper: 'grid grid-cols-1 lg:grid-cols-2',
description: 'lg:mt-0' }"
orientation="horizontal"
- class="rounded-none border-t border-(--ui-border) bg-gradient-to-b from-(--ui-bg-muted) to-(--ui-bg)"
+ class="rounded-none border-t border-(--ui-border) bg-gradient-to-b from-(--ui-bg-elevated)/50 to-(--ui-bg)"
>