Add TailwindCSS to your Nuxt Apps.

Welcome to the Nuxt TailwindCSS module documentation to help you set up Tailwind CSS in your Nuxt application in seconds, with many goodies 🍬.

Get started Star on GitHub

nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@nuxtjs/tailwindcss'],
  tailwindcss: {
    exposeConfig: true,
    viewer: true,
    // and more...
  }
})

Shipped with many features.

Zero Configuration

This module enables a quick and easy setup of Tailwind CSS in your Nuxt application.

CSS Nesting

Supports CSS Nesting with postcss-nesting to use the latest CSS syntax.

Tailwind Viewer

Discover your tailwind config visually with the viewer as well as the Nuxt Devtools integration.

Tailwind Config

Reference your Tailwind config in your application using the #tailwind-config alias, supporting tree-shaking.

Extendable

The module supports the ability to extend the Tailwind config from Nuxt modules or layers.

Open Source

Boasting over 85+ contributors and over 500k+ monthly downloads.