Learn Nuxt with a Collection of 100+ Tips!

tailwindcss
tailwindcss

Add Tailwind CSS to your Nuxt application in seconds with PurgeCSS included for minimal CSS.

@nuxtjs/tailwindcss

Nuxt Tailwind

npm version npm downloads License Nuxt Tailwind CSS Volta board

Tailwind CSS module for Nuxt ⚡️

Features

📖  Read more

Quick Setup

Add @nuxtjs/tailwindcss using the Nuxt CLI to your project

npx nuxi@latest module add tailwindcss

or add @nuxtjs/tailwindcss using your dependency manager

# Using pnpm
pnpm add --save-dev @nuxtjs/tailwindcss

# Using yarn
yarn add --dev @nuxtjs/tailwindcss

# Using npm
npm install --save-dev @nuxtjs/tailwindcss

and then to the modules section of nuxt.config.{ts,js}

export default defineNuxtConfig({
  modules: [
    '@nuxtjs/tailwindcss'
  ]
})

That's it! You can now use Tailwind classes in your Nuxt app ✨

You can test latest additions on Nightly Releases!

📖  Read more

Contributing

You can contribute to this module online:

Edit @nuxtjs/tailwindcss in CodeSandbox Edit @nuxtjs/tailwindcss in Codeflow

Or locally:

  1. Clone this repository
  2. Install dependencies using pnpm i
  3. Prepare for development using pnpm dev:prepare
  4. Start development server using pnpm dev

Docs

Nuxt UI Pro

You can run docs/ locally by using pnpm docs:dev, or to run a build:

  1. Make sure to add your Nuxt UI Pro license in the .env file before building the application.
  2. Run SSG build using pnpm docs:build
  3. Review the production build locally using pnpm docs:preview

Check out the deployment documentation for more information.

License

MIT - Made with 💚