Extension:DarkMode

MediaWiki extensions manual

DarkMode Release status: experimental
Implementation	User interface
Description	Adds a link to a wiki's personal URLs list to toggle dark mode
Author(s)	(MusikAnimaltalk)
Latest version	0.0.1
Compatibility policy	release branches
MediaWiki	1.29+
Database changes	No
License	MIT License
Download	Download extension Git [?]: Download Git master browse repository (GitHub) commit history repository contributors (GitHub) code review
Hooks used BeforePageDisplay PersonalUrls
Translate the DarkMode extension if it is available at translatewiki.net
Check usage and version matrix.
Issues	Open tasks · Report a bug

The DarkMode extension adds a link to the top toolbar to toggle a dark mode theme.

Installation

• Download and place the file(s) in a directory called DarkMode in your extensions/ folder.
• Add the following code at the bottom of your LocalSettings.php:

  wfLoadExtension( 'DarkMode' );
  

• Configure as required.
•  Done – Navigate to Special:Version on your wiki to verify that the extension is successfully installed.

Configuration

Dark Modes works by adding the CSS filter: invert( 1 ) hue-rotate( 180deg ) to the HTML element, and then applies some refinements to MediaWiki UI elements.

Excluding elements from dark mode

On your wiki, you can add the mw-no-invert CSS class to any element that you don't want inverted. Or you could use the same filter CSS above again, which will invert and rotate the elements back to normal.

Styling elements in dark mode

Dark Mode adds the darkmode CSS class to the HTML element. If you want to change the way some elements look in dark mode, just prefix the selector with .darkmode.