☰

Dark Scrollbar

Changes the color of your scrollbar to fit your browser's dark theme.

  1. // ==UserScript==
  2. // @name        Dark Scrollbar
  3. // @namespace   https://github.com/jairjy
  4. // @match       *://*/*
  5. // @exclude     https://outlook.live.com/mail/*
  6. // @exclude     https://discord.com/channels/*
  7. // @exclude     https://web.whatsapp.com/*
  8. // @exclude     https://app.slack.com/client/*
  9. // @grant       none
  10. // @version     1.7
  11. // @author      JairJy
  12. // @run-at       document-start
  13. // @description  Changes the color of your scrollbar to fit your browser's dark theme.
  14. // ==/UserScript==
  15.  
  16. function addGlobalStyle(css) {
  17.     var head, style;
  18.     head = document.getElementsByTagName('head')[0];
  19.     if (!head) { return; }
  20.     style = document.createElement('style');
  21.     style.type = 'text/css';
  22.     style.innerHTML = css.replace(/;/g, ' !important;');
  23.     head.prepend(style);
  24. }
  25.  
  26. addGlobalStyle('::-webkit-scrollbar { width: 15px; }');
  27.  
  28. addGlobalStyle('::-webkit-scrollbar-track { background: #3B3B3B; }');
  29.  
  30. addGlobalStyle('::-webkit-scrollbar-thumb { background: #777777; }');
  31.  
  32. addGlobalStyle('::-webkit-scrollbar-thumb:hover { background: #999999; }');