☰

Greasy Fork is available in English.

Twitter Auto Theme

Automatically switches between light and dark themes on Twitter.com (web version) based on system settings.

  1. // ==UserScript==
  2. // @name         Twitter Auto Theme
  3. // @namespace    https://techandnature.net/
  4. // @version      0.1
  5. // @description  Automatically switches between light and dark themes on Twitter.com (web version) based on system settings.
  6. // @author       Christian Daus
  7. // @match        https://twitter.com/*
  8. // @run-at       document-start
  9. // @license MIT
  10. // ==/UserScript==
  11.  
  12. (function () {
  13.   "use strict";
  14.   const MAX_AGE = 60 * 60 * 24 * 365; //seconds in a year
  15.   let currentNightMode = document.cookie
  16.     .split(";")
  17.     .find(cookie => cookie.includes("night_mode"))
  18.     .split("=")[1];
  19.   let newNightMode;
  20.   let wasThemeSwitched = false;
  21.  
  22.   if (
  23.     window.matchMedia &&
  24.     window.matchMedia("(prefers-color-scheme: dark)").matches
  25.   ) {
  26.     newNightMode = "1";
  27.   } else {
  28.     newNightMode = "0";
  29.   }
  30.  
  31.   if (newNightMode !== currentNightMode) {
  32.     wasThemeSwitched = true;
  33.     document.cookie = `night_mode=${newNightMode}; domain=.twitter.com; secure; max-age=${MAX_AGE}`;
  34.   }
  35.  
  36.   console.log(
  37.     `Twitter Auto Theme: Theme changed: ${wasThemeSwitched}, Night mode: ${newNightMode}`
  38.   );
  39. })();