Enable Discords Hidden Darker and/or Midnight Themes
Note
There are 2 methods that allow you to enable these themes.
Options: Enabling the Experiment or using a script.
This is one of the easiest methods but you'll need Vencord and install the Experiments Plugin or paste the script below to enable and view the "Experiments" tab.
- Install Vencord.
- Install the Experiments Plugin.
- Head over to the "Experiments" tab and search for the "Desktop Visual Refresh" (2024-05_desktop_visual_refresh) experiment
- Set your bucket override to "Treatment 1: Refresh Enabled".
- Go to the Appearance and select your desired theme!
Note
Discord might patch this Script at anytime. If this script doesn't work please try one of the other methods.
Note
Refreshing or restarting your client removes the experiments tab and the setting in the Appearance tab, but you will keep the theme.
How to use this script:
- Open DevTools by pressing
CTRL+SHIFT+I (Windows)
CMD+OPTION+I (MacOS) - Go to the
Console
tab - Paste the following code and hit enter:
let wreq; webpackChunkdiscord_app.push([[Symbol()],{},(r) => wreq = r]);
webpackChunkdiscord_app.pop();
let module = Object.values(wreq.c).find(x => x?.exports?.default?.getUsers).exports.default;;
nodes = Object.values(module._dispatcher._actionHandlers._dependencyGraph.nodes);
try {
nodes.find(x => x.name == "ExperimentStore").actionHandler["OVERLAY_INITIALIZE"]({
user: {
flags: 1
}
});
} catch (e) {}
original = [module.getCurrentUser, module.getNonImpersonatedCurrentUser];
module.getCurrentUser = module.getNonImpersonatedCurrentUser = () => ({
isStaff: () => true
});
nodes.find(x => x.name == "DeveloperExperimentStore").actionHandler["OVERLAY_INITIALIZE"]();
[module.getCurrentUser, module.getNonImpersonatedCurrentUser] = original;
- Head over to the "Experiments" tab and search for the "Desktop Visual Refresh" (2024-05_desktop_visual_refresh) experiment, and set your bucket override to "Treatment 1: Refresh Enabled".
- Go to the Appearance and select your desired theme!
Note
Discord might patch this Script at anytime. If this script doesn't work please try one of the other methods.
Note
Refreshing or restarting your client removes the theme you selected, if you want to keep it forever use this medhod instead.
How to use this script:
1.Open DevTools by pressing
CTRL+SHIFT+I (Windows)
CMD+OPTION+I (MacOS)
2. Go to the Console
tab.
3. Paste one of the following code and hit enter:
(() => {
const a = (a = "theme-darker") => (b => b.contains(a) || b.add(a))(document.body.classList);
a(), new MutationObserver(() => a()).observe(document.body, {
attributes: true,
attributeFilter: ["class"]
})
})();
(() => {
const a = (a = "theme-midnight") => (b => b.contains(a) || b.add(a))(document.body.classList);
a(), new MutationObserver(() => a()).observe(document.body, {
attributes: true,
attributeFilter: ["class"]
})
})();
Credits to @schlizzawg on twitter for the original code!
Q: CTRL+SHIFT+I / CMD+OPTION+I doesn't work
A: Use the PTB Client or Canary Client (links below) or use this to enable DevTools on Windows Stable Client.
On MacOS, open Finder and press SHIFT+CMD+G or click on "Go" in the menubar and select "Go to Folder" in the menu.
In the search bar paste ~/Library/Application Support/discord/settings.json
Open settings.json and turn DevTools on using by setting "DANGEROUS_ENABLE_DEVTOOLS_ONLY_ENABLE_IF_YOU_KNOW_WHAT_YOURE_DOING": true
You can still open DevTool on the stable Web Client
Windows
Canary
PTB
MacOS
Canary
PTB
Web
Canary
PTB
Q: Can I use QuickCSS?
A: Yes, but it's pretty complicated. Copy and paste the contents of the .theme-darker class and rename it to .theme-dark in a QuickCSS (I'm not gonna explain how, you can ask other people in this gist if anyone even sees this gist)
There are probably more methods such as editing the theme-dark class in the body tag of the app to theme-darker or theme-midnight but Discord forces you to switch back.