Introduction
This guide covers dark mode, how to select it, and how to enable it.
What is dark mode?
As Forbes explains,
The idea behind dark mode is that it reduces the light emitted by device screens while maintaining the minimum colour contrast ratios required for readability.
Dark mode is essentially a mainly dark theme on your device (black or grey, usually), with light text on it for contrast. Discourse has many themes that have both light and dark color schemes.
How do I select dark mode?
In your Discourse forum, your admin first needs to install it. Under admin/customize/themes, the admin can choose ‘Dark’ under the list of popular themes.
Afterwards, you will need to go to my/preferences/interface to change themes. You should see this page.
(Mobile)
After this, select the dropdown where the cuurent theme is displayed, or under the ‘Theme’ dropdown. In my case, it’s Meta Branded.
Then, choose from the dropdown Dark, or any theme that has a dark color scheme (we’ll find out how in a short bit).
After selecting your theme of choice, click on the Regular dropdown. Select any color scheme that has the word ‘Dark’ in it. Common ones include ‘Dark’, ‘WCAG Dark’ and ‘Solarized Dark’.
Selecting any color scheme for light mode will not yield good results when following this guide. It is advised that you select ‘Dark’ for this guide, as that is what we will be using.
After doing all this, you may click the Save Changes button at the bottom of the page. This will make Discourse go into dark mode (or, rather, a dark color scheme).
What is the dark mode dropdown for?
I know you’re probably wondering this.
To put it simply, the color scheme you put there is activated when your device is in dark mode. The color scheme selected will override the one selected in the ‘Regular’ dropdown when your device is in dark mode.
Generally, you wouldn’t be changing this. However, if you have selected a color scheme in ‘Regular’ and wish to be the same in ‘Dark mode’ without having to keep switching when changing color schemes, you can set the ‘Dark mode’ dropdown to ‘Same as regular’, so that Discourse will follow the scheme selected in ‘Regular’.
If your device is on light mode, the ‘Dark mode’ dropdown won’t have any effect.
So… how do I check if a theme has a dark color scheme?
Ah, yes! Basically, you can select a theme and have a glance at the color schemes supported, and check if there are any dark color schemes. A good gauge is to look for ‘WCAG Dark’, as it is a color scheme that follows accessibility guidelines.
Conclusion
So that’s it! You managed to locate the area to change your theme to dark mode, and experimented with different color schemes!
Sources and Citations
Forbes: What Is Dark Mode – And Should You Be Using It? – Forbes Advisor UK
Adding dark mode for admins: Looking for default dark theme - #2 by JammyDodger
All information in this guide is not generated by AI, except for image captions. All other information is original, and where it is not, is linked above.
