Add Tailwind CSS to Next.js

InstructorPavithra Kodmad

Share this video with your friends

Send Tweet

We will learn the various steps necessary to add tailwindcss support to a nextjs application.

Step 1 - Install tailwindcss, postcss and autoprefixer

Step 2 - Run npx tailwind init -p to create the required configuration. Add purge filters here.

Step 3 - Add a styles folder and a tailwind.css file. In this file import the important tailwind classes.

Step 4 - Override nextjs' app component to include tailwind classes.

Now you can start using tailwindcss classes to style your nextjs application

This lesson is a Community Resource

A Community Resource means that it’s free to access for all. The instructor of this lesson requested it to be open to the public.