Source: www.amitmerchant.com

Implementing dark mode using Tailwind 3.0
Dark mode (or night mode) has been an inherently important feature that has been with all the latest operating systems. And with the rise of the dark mode increases the requests to implement one with your favorite websites as well. So, if you’re having a website, you might as well consider implementing a dark mode, aren’t you?

There are two strategies using which you can implement dark mode using this variant.

Under the hood, the dark: variant uses the https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme CSS media query feature to decide whether to apply dark mode or light mode.
Newsletter

Get the latest Laravel/PHP jobs, events and curated articles straight to your inbox, once a week

Fathom Analytics | Fast, simple and privacy-focused website analytics. Fathom Analytics | Fast, simple and privacy-focused website analytics.
Achieve superior email deliverability with ToastMail! Our AI-driven tool warms up inboxes, monitors reputation, and ensures emails reach their intended destination. Sign up today for a spam-free future. Achieve superior email deliverability with ToastMail! Our AI-driven tool warms up inboxes, monitors reputation, and ensures emails reach their intended destination. Sign up today for a spam-free future.
Community Partners