Having a bright screen at night is really painful for our eyes. That’s why the dark mode feature is necessary if we want to take care of our user’s eyes.

In this lesson, we’ll learn how to enable dark mode in our Next.js application to keep our users engaged with our app all night long.

We will see how we can easily implement the dark mode feature by using and combining next-themes and Tailwind CSS. And we’ll add the ability for our users to toggle between light and dark mode from the user interface.

Finally, we’ll make sure to avoid hydration mismatch by using React hooks.

#next.js #react