Theme your project

Style your Next.js project with TailwindCSS.

Now let's to add a TailwindCSS class to an element and see if it works. Open pages/index.js file and pick an element and remove the className default style and replce it with a TailwindCSS class. For example:

<code className={styles.code}>pages/index.js</code>

and change it to

<code className="text-red-500 font-bold">pages/index.js</code>

Your turn

Click on the Dev Environment button and follow the readme file instruction to install change the default themeing with TailwindCSS in a live project.