User:Dialectric/dark-mode

From Wikipedia, the free encyclopedia
User script
darklands.css
DescriptionDark mode for Wikipedia Vector skin
Author(s)Dialectric
Statusin development
UpdatedJanuary 20, 2024
    (3 months ago)
Browser supportModern browsers with CSS `filter` support
Skin supportVector legacy (2010), Vector 2022

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. In 2020, I modified the css for the Vector wikipedia skin to use a Light-on-dark color scheme with a palate similar to the Monokai palate available in several code editing programs. I updated this css in July 2023, though only for the Vector legacy version. In January 2024, I added support for Vector 2022 (default version).

The css is available at User:Dialectric/vector.css and User:Dialectric/vector-2022.css. Please feel free to try it out and make suggestions on my talk page. It works well for most general page and talk editing, but does not cover tables found on some admin and archive pages, and occasional in-article tables with set background colors. This skin was built off of the Skin:Vector-DarkCSS.

When trying new themes and scripts, an important consideration is the risk of importing malicious code from outside of wikipedia. This css theme does not import code, does not use "importScript" or "iusc", and the only external links used are to icons / UI elements on commons.

Version 2.0 (July 2023) improvements:

  • dark tables
  • darker homepage headings
  • adjusted notification popup styles
  • various uncommon white/light boxes overridden with dark
  • more compatibility with newer vector features


Version 2.1 (Jan 2024)


The old version 1 of this theme is available through page history: https://en.wikipedia.org/w/index.php?title=User:Dialectric/vector.css&oldid=1081653758