Wikipedia:Dark mode

Source: Wikipedia, the free encyclopedia.

A

customization
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.

As of January 2024, there is a dark mode in development.[1]

Options for logged-in users

There are two Gadgets that can be enabled in Preferences:

  • Under the "Appearance" section of the "Gadgets" tab, select the checkbox for "Dark mode toggle". Once checked, dark mode is available to toggle in the Profile Dropdown Box, located in the Upper Right-Hand corner of the page.
  • Dark mode gadget screenshot
    WikimediaUI Dark mode gadget
  • Also found under the "Appearance" section of the "Gadgets" tab, is the checkbox with text: "Use a black background with green text".

Apart from gadgets, 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:

  • Dark mode CSS screenshot
    Dialectric's darklands theme
  • Dark mode CSS screenshot
    DavidL's thème sombre
  • Dark mode CSS screenshot
    Tollens' dark theme
  • Dark minimal theme from Vitaly Zdanevich
    Dark minimal theme from Vitaly Zdanevich
Compatibility table
Timeless Vector (2022) Vector old (2010) MinervaNeue MonoBook
WikimediaUI Dark mode Increase Increase Increase Increase Increase
Darklands dark theme Decrease Decrease Increase Decrease Increase
DavidL's DarkTheme Increase Increase Increase Increase Increase
Tollens' dark theme Decrease Increase Increase Increase Increase
Vitaly Zdanevich's dark theme Decrease Decrease Increase Decrease Decrease

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.

There are several add-on/extension offerings on Firefox which work well. The most popular is Dark Mode for Wikipedia which uses only a single css style sheet to enable dark mode on Wikipedia. Do not install any extension or add-on that you don't trust.

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 dark mode extension for MediaWiki. According to the developer, this "extension will not be deployed to WMF wikis".

Other Mediawiki options include:

Notes

  1. ^ "Dark mode is coming".