Wikipedia:Dark mode
 | This is an information page. It is not one of Wikipedia's policies or guidelines; rather, its purpose is to explain certain aspects of Wikipedia's norms, customs, technicalities, or practices. It may reflect differing levels of consensus and vetting. |
A light-on-dark color scheme (dark mode, night mode) — has been suggested as an option / enhancement to Wikipedia numerous times since 2010, including on Phabricator. Wikipedia's smartphone apps offer an official night mode, but the desktop settings do not. While there is no official desktop dark mode as of April 2022, there is a gadget on English Wikipedia, and various volunteer-written css files that allow Wikipedia:Customisation for logged-in users. More limited options exist for non-logged-in users. No current options are actively supported or maintained by the Wikimedia Foundation.
Options for logged-in users
The simplest approach is to enable the dark mode gadget by selecting a checkbox on your Preferences > Gadgets page in settings. This checkbox, found under 'Appearance', activates the WikimediaUI Dark mode described below. As an optional enhancement, User:SD0001 has written Javascript which adds a toggle to turn on and off this gadget: User:SD0001/dark-mode-toggle.js.
-
WikimediaUI Dark mode gadget
Another way to get a dark mode is adding custom css to your user style page(s). This is more complex than activating a gadget, but more flexible, allowing, for example: custom colors, custom fonts, or hiding unused UI elements. Help:User style describes the process of adding custom css in general. For dark mode-specific css, a number of options are available including:
- WikimediaUI Dark mode - the css powering the dark mode gadget usable as a standalone style without the gadget, stable version from April 25, 2020, by User:AHollender (WMF), User:Volker E. (WMF),User:MusikAnimal
- Darklands dark theme - a low contrast dark mode in development Nov 2021, tested with Vector only, by User:Dialectric
- DavidL's DarkTheme - in Development Oct 2021 - by User:DavidL
-
Dialectric's darklands theme -
DavidL's thème sombre
Options for unregistered users
There are browser extensions for popular browsers that offer a Wikipedia-specific dark mode, and browser extensions that allow you to set custom css for a given domain, which could be used with the css available above. However, all browser extensions need to be carefully screened for security issues, some inject advertising, and customization may be more difficult than editing a single css file.
If you use Chrome, there is also a built-in experimental/beta setting to force dark mode, set through chrome://flags/ with the description 'Force Dark Mode for Web Contents - Automatically render all web contents using a dark theme.' This is provided by Chrome's development team, so security should not be a concern, but this will render all web pages in dark mode. This feature is also available in Microsoft Edge, through the edge://flags/ menu.
MediaWiki dark mode options
MediaWiki dark modes often lack Wikipedia-specific css classes, which can result in unexpected page rendering when used with Wikipedia. They may provide useful ideas in improving Wikipedia-specific dark modes, however.
There is an active project on phabricator to add a DarkMode extension for MediaWiki. According to the developer, this 'extension will not be deployed to WMF wikis'.
Other Mediawiki options include:
- MediaWiki's Category:Skins with dark mode lists Skin:Aether, Skin:Citizen, Skin:DarkCosmos, User:Aron Manning/Skin themes and Skin:Vector/DarkCSS
- MediaWiki:Gadget-Blackskin.css
- MediaWiki:Gadget-dark-mode.css