Manual:Dark mode

Dark mode is when MediaWiki uses a light-on-dark color scheme.

This can be implemented with a skin, an extension or user style/gadget.

How to enable dark mode

Recommended solutions

In 2025, the recommended way for MediaWiki skins to use dark mode is to make use of CSS custom properties and define a dark mode palette that applies when the user has expressed a preference for dark mode at the operating system level (using prefers-color-scheme) or opted into dark mode via the UI.

The approach is used on Wikimedia web projects (Vector 2022 and Minerva). The Wikipedia apps also support their own dark themes, although via a separate implementation.

One of the implications of this is that template editors must adapt their content to work in dark mode.

Therefore, template authors should be familiar with Recommendations for night mode compatibility on Wikimedia wikis for understanding how to make templates that are compatible with MediaWiki's dark mode implementations.

Skins that support dark mode are collected under Category:Skins with dark mode .

Website

On Wikimedia sites using the default Vector 2022 (desktop) and Minerva (mobile) skins, dark mode is available to both logged-in and logged-out readers as part of the Accessibility for reading project.

On desktop (Vector 2022), readers can change the appearance from the controls in the top-right of the page:

• Open the appearance menu (for example via the spectacles icon in the personal tools area) and choose Light, Dark or Automatic.

On mobile (Minerva), readers can:

• Open the main menu (the "hamburger" icon), tap Settings, then in the Color section choose Light, Dark or Automatic.

In both cases, the Automatic option follows the operating system preference, if the browser supports {{Cssom-view }}’s prefers-color-scheme.

• Desktop dark mode setting
• Desktop dark mode setting (on smaller screens, or when menu has been hidden)
• Finding mobile dark mode setting (1)
• Finding mobile dark mode setting (2)
• Finding mobile dark mode setting (3)

Mobile Apps

The official Wikipedia mobile apps for Android and iOS have multiple themes available, including light-on-dark.

• Wikipedia Android app white theme
• Wikipedia Android app sepia theme
• Wikipedia Android app dark theme
• Wikipedia Android app black theme

Generic solutions

A typical generic solution to dark mode is to apply a CSS filter across the entire page to make the page darker. This approach can be applied generally to all skins that do not support dark mode, but has several limitations including:

• performance problems on large pages and older devices
• can lead to misinformation—where colors correspond with information and are incorrectly darkened (for example articles about colors such as International Orange)

For third parties that understand the downsides of this approach, the Extension:DarkMode can be installed or a MediaWiki gadget / site-wide user script can be applied. For logged-in users, the gadget can be modified as a user script . For anonymous users, various browser extensions exist. Wikipedia:Dark mode lists options for registered and unregistered users.

User stylesheets

An alternative approach for adding dark mode is to define a user stylesheet that overrides existing rules provided by the skins. The problem with this is that it must be updated every time the skin changes.

Such user styles are collected in Category:User scripts for enabling dark mode and may be packaged as user CSS or gadgets .

Forcing dark mode temporarily

You can temporarily force MediaWiki's dark mode for testing purposes by adding a URL parameter to the page. These parameters are primarily intended for debugging and may change or be removed in the future:

• ?vectornightmode=1 — forces dark mode in the Vector 2022 desktop skin
• ?minervanightmode=1 — forces dark mode in the Minerva mobile skin

These parameters override the user’s system preference and the skin’s default behavior. They are not intended as long-term or user-facing configuration options.

How to report issues with dark mode

Issues with third-party gadgets

Please report issues with gadgets or user scripts directly to the associated gadget or user script talk page. Please do not use Phabricator to report issues with gadgets, as they will not reach the right person.

Issues with content in Wikimedia sites

For issues relating to the content itself—for example infoboxes or boxes that appear on the side of the article—it is best to report them to editors via the talk page or attempt to fix them using Recommendations for night mode compatibility on Wikimedia wikis as a guide.

In some cases, you may be able to fix issues yourself by clicking edit and updating inline styles. In other cases, fixes may require edits to commonly transcluded templates that you do not have permission to edit. If you need to identify the responsible template, you can click edit using VisualEditor and hover over the element. Use the talk page to communicate the issue.

Issues with user interface in Wikimedia software

For issues in dark mode, please file bugs against the associated extension. For example, if you notice an issue inside the Echo notification dialog, file a ticket against the Echo extension and tag #dark-mode. The generic catch-all tag may be used when you cannot identify the cause.

For issues specifically on non-Wikimedia sites with Extension:DarkMode , please use the dedicated Phabricator tag. This extension is not used on Wikimedia sites.

History

Timeline may be out of date and some dates prior to 2019 may be inaccurate – please update if you have the knowledge!

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

February 2019 - Dark mode is the 2nd wish in the community wishlist survey. It was planned under the desktop improvements project.

May 2019 - The desktop improvements project begins, kicking off work on Codex and design tokens that would later enable dark mode.

May 2019 - The Community Tech team discuss applying a generic dark mode solution that uses an invert, as part of the Wishlist survey.

September 2019 - Volker releases the first dark mode gadget.

December 2021 - English Wikipedia adds a dark mode gadget.

February 2022 - Dark mode is the top wish of the large ideas on the community wishlist survey.

February 2023 - Dark mode again tops the 2023 wishlist.

June 2023 - The desktop improvements project concludes, adding support for preferences for logged out users. We are able to consider a native dark mode experience for anonymous users for the first time.

July 2023 - The accessibility for reading project begins with scope of supporting controls for changing text size and color scheme.

November 2023 - Dark mode is announced on the Wikimedia blog.

January 2024 - Development on dark mode begins.

March 2024 - Support for CSS variables is added in Codex .

June 2024 - Support for CSS variables is added in OOUI .

See also

• Wikipedia:Dark mode
• dark color scheme