Tailwind CSS Dark Mode Switch

Dark Mode/Light Mode switcher with Tailwind CSS.

Required Package

• Tailwind CSS

Install Tailwind CSS

npm install -D tailwindcss
npx tailwindcss init

Configure toggling dark mode manually

Add darkMode: 'class' to tailwind.config.js

/** @type {import('tailwindcss').Config} */
module.exports = {
  darkMode: 'class',
  // ...
}

Usage

• Astro -> Astro Sample
• Pug -> Pug Sample

Demo

• demo page