34

Stack Overflow has a dark theme option for several months now. Why is the same option not available on Super User? And across all the exchanges.

7
  • Because it hasn't been implemented yet.
    – DavidPostill Mod
    Oct 28, 2021 at 17:14
  • I think it's the same code base. Oct 28, 2021 at 17:22
  • "...creating dark versions of all of our sites, particularly the custom-designed ones, is going to be a huge challenge we’re not able to contemplate at this time"
    – DavidPostill Mod
    Oct 28, 2021 at 18:00
  • No one is saying to do them all at the same time. Start with the most popular ones. One by one. The look and feel between SO and superuser is very similar apart from some images. I am pretty sure there's a lot of common css elements between them. Oct 28, 2021 at 18:04
  • {shrug}. If you feel strongly enough please post on meta.stackexchange.com
    – DavidPostill Mod
    Oct 28, 2021 at 18:08
  • Looks like they are working on it. Oct 28, 2021 at 23:44
  • 1
    That's correct, it is indeed in the works: "Dark mode across the whole network is something we're actively working towards, but there's still a lot of work to be done. We've been rolling out a lot of behind-the-scenes changes to network theming that users (usually) don't notice to get us closer to our ideal theming state. I don't have any news or a concrete timeline at the moment, so thank you for your continued patience on the matter."
    – zcoop98
    Oct 29, 2021 at 16:21

3 Answers 3

6

I created a bookmarklet that I use whenever I encounter a website that doesn't provide dark mode (including this one). This is a quick-and-dirty dark mode button which works on a lot of websites, and it wouldn't take much to make it a little better. If you are not familiar with bookmarklets, it's just a bookmark that runs a little javascript - simply create a bookmark and edit the URL to use this:

javascript: (()=>{var e="quick-and-dirty-dark-theme",d=document,i=d.getElementById(e);if(i)d.body.removeChild(i);else{var r=d.createElement("style");r.id=e,r.innerHTML="html, img, video, iframe { background: #fff; filter: invert(0.9) }",d.body.appendChild(r)}})();

The above is the minified verion of the following code. You can test it out by pasting this into your console:

(() => {
  var id = 'quick-and-dirty-dark-theme';
  var doc = document;
  var existing = doc.getElementById(id);
  if (existing) doc.body.removeChild(existing);
  else {
    var style = doc.createElement("style");
    style.id = id;
    style.innerHTML = "html, img, video, iframe { background: #fff; filter: invert(0.9) }"; 
    doc.body.appendChild(style);
  }
})()
2
  • 1
    I'm using this for quite a while now, and it is awesome!
    – Caeleste
    Jul 23, 2023 at 16:05
  • 1
    Thanks. Once you have it, almost every page on the internet can have instant dark theme. Glad it has helped you! Jul 24, 2023 at 17:22
3

Aside: While looking into writing a better userStyle for this, I noticed CSS rules for .theme-dark and :not(.theme-dark). Part of the site is already dark-mode ready, which can be inspected by giving the body the class .theme-dark.

In the meantime, I wrote a userStyle for extensions like Stylus

2

It has not been implemented yet

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .