/nuxt3-tailwindcss3-starter-kit

The template that starts tailwindcss fastest on nuxt3 without annoying settings

Primary LanguageVue

Nuxt 3 With Tailwindcss 3

🔥 If We need anything, I will add it.

The template that starts tailwindcss fastest on nuxt3 without annoying settings

Features

  • 💚 Nuxt 3 - SSR, ESR, File-based routing, components auto importing, modules, etc.
  • ⚡️ Vite - Instant HMR
  • 🎨 Tailwindcss - A utility-first CSS framework for rapidly building custom user interfaces.
  • ⚒️ HeadlessUI - A set of completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
  • 🔥 The <script setup> syntax
  • 🍍 State Management via Pinia
  • 📥 APIs auto importing - For Composition API, VueUse and custom composables.
  • 🏎 Zero-config cloud functions and deploy
  • 🦾 TypeScript, of course

Nuxt Modules

  • VueUse - collection of useful composition APIs
  • ColorMode - dark and Light mode with auto detection made easy with Nuxt.
  • Pinia - intuitive, type safe, light and flexible Store for Vue.
  • NuxtIcon - Icon module for Nuxt with 100,000+ ready to use icons from Iconify.
  • NuxtHeadlessUI - Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.
  • NuxtVitest - A vitest environment for testing code that needs a Nuxt runtime environment
  • NuxtDevtools - Nuxt DevTools is a set of visual tools that help you to know your app better.

IDE

Try it now!

GitHub Template

Create a repo from this template on GitHub.

Clone to local

If you prefer to do it manually with the cleaner git history

npx degit initred/nuxt3-tailwindcss3-starter-kit my-nuxt3-app
cd my-nuxt3-app
pnpm i # If you don't have pnpm installed, run: npm install -g pnpm