Reading/Web/Accessibility for reading/Updates/2024-04

Early access to the dark mode (mobile web, logged-in)

Read this in your languagePlease help translate to your language

 

Hi everyone, as announced in November, the Web team at the Wikimedia Foundation is working on dark (sometimes also called night) mode. Now, we have released the feature for logged-in users of advanced mobile mode across all wikis for testing purposes. But don't worry, the new feature is not disruptive! (See the "known limitations" section below.) It's just important for us to work together with you before we release this feature to a wider audience. Our goals for the early rollout are to:

  • Show what we've built very early. The earlier you are involved, the more your voices will be reflected in the final version
  • Get your help with flagging bugs, issues, and requests
  • Work with technical editors to adjust various templates and gadgets to the dark mode

Go to the project page and the FAQ page to see more information about the basics of this project.

Known limitations of the initial release

  • Currently, dark mode is only available on mobile, for logged-in users who have opted into advanced mode, as an opt-in feature.
  • Gadgets may initially not work well with dark mode and may have to be updated.
  • Our first goal is making dark mode work on articles. Special pages, talk pages, and other namespaces have not been updated to work in dark mode yet. We have temporarily disabled dark mode on some of these pages.

What we would like you to do (the broad community)

If you have questions - ask us! Also, where appropriate, consider linking to the Recommendations for dark mode compatibility on Wikimedia wikis on pages explaining how to define colors in code. Soon, this page will be marked for translation. We would like to emphasize that the recommendations may evolve. For this reason, we are not suggesting to create your local wiki copies of recommendations. At some point, the copy could become different from the original version.

What we would like you to do (template editors, interface admins, technical editors)

When most bugs are solved, we'll be able to make the dark mode available for readers on both desktop and mobile. To make this happen, we need to work together with you on reporting and solving the problems.

  1. To turn it on, use the mobile website and go to the settings part of your menu and opt into advanced mode, if you haven't already. Then, set the color to dark. (Later, we will be allowing the device preferences to set dark mode automatically).
  2. Next, go to different articles and look for issues:
    • If you have noticed an issue with a template but do not know how to fix it
      1. Go to the recommendations page and find a relevant example
      2. If no relevant example is available or you're not sure of the fix, contact us
    • If you want to debug many templates in dark mode
      1. Go to https://night-mode-checker.wmcloud.org/ and identify templates that need to be fixed. The tool flags the top 100 most read articles.
      2. Go to the recommendations page and find a relevant example
      3. If no relevant example is available or you're not sure of the fix, contact us
    • If you want to identify problems beyond the top 100 articles.
      1. Install the WCAG color contrast browser extension (Chrome, Firefox) and visit some articles. Use it to identify problems
      2. Go to the recommendations page and find relevant examples
      3. If no relevant example is available or you're not sure of the fix, contact us
    • If you have a bug report for dark mode that is not related to templates
      1. Take a screenshot of what you are observing.
      2. Contact us. If possible, please write down your browser version and operating system version.

Thank you. We're looking forward to your opinions and comments!