How to force DARK mode on any website!

🌸 Bismillahir-rahmanir-raheem 🌸

You can enable dark mode on a website using the browser's developer console (Inspector). Here's how:

Method 1: Using CSS in the Console

1. Open the Developer Console:

   • Press F12 or Ctrl + Shift + I (Windows/Linux)

   • Press Cmd + Option + I (Mac)

   • Navigate to the Console tab.

2. Enter the following CSS to invert colors and simulate dark mode:

    document.body.style.filter = "invert(1) hue-rotate(180deg)";
   

   • This inverts the colors, making light backgrounds dark.

   • If images look weird, fix them using:

       document.querySelectorAll('img').forEach(img => img.style.filter = "invert(1) hue-rotate(180deg)");
     

---

Method 2: Add a Dark Mode CSS Rule

1. Run this in the console:

    let style = document.createElement('style');
    style.innerHTML = `
      body {
        background-color: #121212 !important;
        color: #ffffff !important;
      }
      a { color: #bb86fc !important; }
      img { filter: brightness(0.8); }
    `;
    document.head.appendChild(style);
   

2. This manually applies dark mode styles to the page.

---

Method 3: Simulate Dark Mode with prefers-color-scheme

Some websites support dark mode automatically. Force the browser to apply it with:

document.documentElement.style.setProperty('color-scheme', 'dark');

This works on sites that respect prefers-color-scheme: dark.