First, if you want to install Tailwind in NextJS. Create your own NextJS project. After you have NextJS project and then open your Folder Project and Open CMD in that folder.

  1. Type in your CMD (Command Prompt), “npm install -D tailwindcss postcss autoprefixer” and “npx tailwindcss init -p”. If you want Tailwind CSS config full you can type this command “npx tailwindcss init -p --full”. With that command you generate both “tailwind.config.js” and “postcss.config.js”.
  2. After both of that file generated you can open tailwind.config.js and change content with “content: [ “./pages/**/*.{js,ts,jsx,tsx}”, “./components/**/*.{js,ts,jsx,tsx}”, ],”.
  3. And then you can add the Tailwind directives to your CSS in “globals.css”. Type this in your globals.css “@tailwind base;”, “@tailwind components;” and “@tailwind utilities;”.

Now you can use Tailwind CSS in your project. Happy code (:

--

--