0

I read:

We don't officially support dark mode on SE sites as there are still some accessibility and other issues to iron out, but I went ahead and did a dark mode version of your theme. If you add the theme-dark class to the body HTML, you will see this. I believe there are some browser extensions out there that might help with this.

Which Chrome extension can add a theme-dark class to the body HTML?

1 Answer 1

2

I couldn't find an extension which does this exactly. However you can do this indirectly with Tampermonkey.

With this extension you can install scripts created by others (such as the scripts created on https://stackapps.com/), or create your own script. In this case, the code to accomplish this is a very simple one liner:

// Adds the `theme-dark` class to the body element if it doesn't already exist
document.body.classList.add("theme-dark");

To use this script for SE, first install Tampermonkey, then open the Tampermonkey dropdown and click "Create a new script...", then paste the following code into the editor, then go "File" and click "Save". This looks like a lot more code than I indicated above, but a lot of it is the boilerplate code and metadata that Tampermonkey automatically adds plus some match tags so our code only targets Stack Exchange sites.

// ==UserScript==
// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://*.stackexchange.com/*
// @match        https://*.meta.stackexchange.com/*
// @match        https://stackoverflow.com/*
// @match        https://superuser.com/*
// @match        https://askubuntu.com/*
// @match        https://serverfault.com/*
// @match        https://mathoverflow.net/*
// @match        https://stackapps.com/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=tampermonkey.net
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    // Adds the `theme-dark` class to the body element if it doesn't already exist
    document.body.classList.add("theme-dark");
})();

By the way, I tried using this for a couple sites on the network and a couple don't play well with it (such as English.SE).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.