Install Tailwind CSS

Configure Tailwind CSS in your Next.js project.

Install Packages

If you already have a Next.js project without Tailwind CSS, install it:

npm install tailwindcss @tailwindcss/postcss postcss

Create or update your postcss.config.mjs file:

export default {
plugins: {
  "@tailwindcss/postcss": {},
},
};

Add the Tailwind CSS import to your global CSS file (src/app/globals.css):

@import "tailwindcss";