☰

Instagram Dark Mode

A dark mode for Instagram

  1. // ==UserScript==
  2. // @name         Instagram Dark Mode
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.2
  5. // @description  A dark mode for Instagram
  6. // @author       Amenly
  7. // @match        homepage
  8. // @match        https://www.instagram.com/*
  9. // @grant        none
  10. // ==/UserScript==
  11.  
  12. function addGlobalStyle(css) {
  13. 	var head, style;
  14. 	head = document.getElementsByTagName('head')[0];
  15. 	if (!head) { return; }
  16. 	style = document.createElement('style');
  17. 	style.type = 'text/css';
  18. 	style.innerHTML = css;
  19. 	head.appendChild(style);
  20. }
  21.  
  22. addGlobalStyle('._3Laht, .o64aR { background-color: #26282b !important; }'); //main background
  23. addGlobalStyle('._lz6s { background-color: #353941 !important; }'); //gray header
  24. addGlobalStyle('.Di7vw { background: #50728c !important; }'); //search bar background
  25. addGlobalStyle('.Di7vw { border: solid 1px #50728c !important; }'); //search bar border
  26. addGlobalStyle('.pbgfb { color: #999999 !important; }'); //'Search' text
  27. addGlobalStyle('.x3qfX { background-color: #50728c !important; }'); //search bar background after clicking
  28. addGlobalStyle('.XTCLo { border: solid 1px #50728c !important; }'); //search bar border after clicking
  29. addGlobalStyle('.fuqBx { background-color: #353941 !important; }'); //search results background after clicking
  30. addGlobalStyle('.JvDyy { background: #50728c !important; }'); //search result during mouse hover
  31. addGlobalStyle('.Ap253 { color: #5f85db !important; }'); //handle text color in search result
  32. addGlobalStyle('.Fy4o8 { color: #90b8f8 !important; }'); //username text color in search result
  33. addGlobalStyle('.L3NKy, a.L3NKy, a.L3NKy:visited { background-color: #50728c !important; }'); //'Log In' background
  34. addGlobalStyle('a.tdiEy, a.tdiEy:visited { color: #50728c !important; }'); //'Sign Up'
  35. addGlobalStyle('.-fzfL { border-color: #50728c !important; }'); //'Following' border color
  36. addGlobalStyle('.-fzfL { color: #50728c !important; }'); //'Following' text color
  37. addGlobalStyle('.KV-D4 { color: #5F85DB !important; }'); //handle color
  38. addGlobalStyle('.g47SY { color: #90b8f8 !important; }'); //#posts, #followers, #following
  39. addGlobalStyle('.-nal3, .-nal3:active, .-nal3:hover, .-nal3:visited { color: #5F85DB !important; }'); //posts, followers, following
  40. addGlobalStyle('._32eiM, ._32eiM:visited { color: #5f85db !important; }'); //'Followed by ____ + x more'
  41. addGlobalStyle('.zwlfE { color: #5f85db !important; }'); //username color
  42. addGlobalStyle('a.T-jvg, a.T-jvg:visited { color #50728c !important; }'); //'POSTS'
  43. addGlobalStyle('a, a:visited { color: #50728c !important; }'); //'TAGGED'
  44. addGlobalStyle('.T-jvg { border-top: 1px solid #999999 !important; }'); // line above 'POSTS'
  45. addGlobalStyle('._3G4x7 { color: #50728c !important; }'); //'LANGUAGES'
  46. addGlobalStyle('.DINPA { color: #90b8f8 !important; }'); //'INSTAGRAM FROM FACEBOOK'
  47. addGlobalStyle('.eXle2 { color: #90b8f8 !important; }'); //text color of highlight names
  48.  
  49. //for pages with 'Requested'
  50.  
  51. addGlobalStyle ('._8A5w5, a._8A5w5, a._8A5w5:visited { border: 1px solid #50728c !important; color: #50728c !important; }'); //'Requested' border and 'Requested' text color
  52. addGlobalStyle('._4Kbb_ { border: 1px solid #50728c !important; }'); //blank space border
  53. addGlobalStyle('._4Kbb_ { background-color: #353941 !important; }'); //blank space
  54. addGlobalStyle('.tHaIX { background-color: #26282b !important; }'); //lower blank space
  55. addGlobalStyle('._41KYi { background: #353941 !important; }'); //profile blank space
  56. addGlobalStyle('._41KYi { border: 1px solid #50728c !important; }'); //profile space border
  57. addGlobalStyle('.Qj3-a, .Qj3-a:visited { color: #50728c !important; }'); //profile space--handle color
  58. addGlobalStyle('._7cyhW { color: #90b8f8 !important; }'); //profile space--username color
  59. addGlobalStyle('.L3NKy, a.L3NKy, a.L3NKy:visited { background-color: #90b8f8 !important; }'); //profile space--follow button background
  60. addGlobalStyle('.L3NKy, a.L3NKy, a.L3NKy:visited { border: #50728c !important; }'); //profile space--follow button border
  61. addGlobalStyle('.L3NKy, a.L3NKy, a.L3NKy:visited { color: #50728c !important; }'); //profile space--follow text color
  62. addGlobalStyle('.Rebts { color: #5F85DB !important; }'); //'Suggestions For You'
  63. addGlobalStyle('.VIsJD, .rkEop { color: #5F85DB !important; }'); //'This Account is Private'
  64.  
  65. //annoying white line
  66. addGlobalStyle('.Nd_Rl, .fx7hk { border-top: 1px solid #50728c !important; }'); // annoying white line
  67.  
  68. //for pages you have neither followed nor requested to follow
  69.  
  70. addGlobalStyle('.jIbKX, .m4t9r.jIbKX { background: #90b8f8 !important; color: #353941 !important; }'); //'Follow' + Drop down
  71. addGlobalStyle('.jIbKX, .m4t9r.jIbKX { border-color: #90b8f8 !important; }'); //border color of Follow and drop down
  72.  
  73. // // // // // // // // //
  74.  
  75. //for pages that result in 'Sorry, this page isn't available
  76.  
  77.  
  78. addGlobalStyle('.-cx-PRIVATE-NavBar__root__ { background-color: #353941 !important; border-bottom: 1px solid #353941 !important; }'); //gray header
  79. addGlobalStyle('.-cx-PRIVATE-NavBar__username__ { color: #90b8f8 !important; }'); //username color
  80.  
  81. //fixes to 'Sorry, this...'
  82. addGlobalStyle('h2 { color: #90b8f8 !important; }'); //'Sorry, this page isn't available' text color
  83.  
  84. addGlobalStyle('.-cx-PRIVATE-ErrorPage__errorContainer__ { background-color: #26282b !important; padding: 100px 40px 0; }'); //upper background
  85. addGlobalStyle('.-cx-PRIVATE-Page__main__ { background-color: #26282b !important; }'); //background color
  86.  
  87. addGlobalStyle('body { background-color: #26282b !important; }'); //full background
  88. addGlobalStyle('.-cx-PRIVATE-Footer__copyright__ { color: #90b8f8 !important; }'); //2019 Instagram
  89.  
  90.  
  91.  
  92. //for individual posts
  93. addGlobalStyle('.ltEKP .QBXjJ { border: 1px solid #26282b !important; }'); //border color
  94. addGlobalStyle('.ltEKP .QBXjJ { background-color: #353941 !important; }'); //main background color
  95. addGlobalStyle('.JyscU.ePUX4 .UE9AK { border-left: 1px solid #353941 !important }'); //upper box--left border
  96. addGlobalStyle('.JyscU.ePUX4 .eo2As { border-left: 1px solid #353941 !important }'); //mid box-left border
  97. addGlobalStyle('.JyscU .UE9AK { border-bottom: 1px solid #999999 !important }'); //upper box-bottom border
  98. addGlobalStyle('.JyscU .Slqrh { border-top: 1px solid #999999 !important }'); //mid bottom box-top border
  99. addGlobalStyle('.sH9wk { border-top: 1px solid #999999 !important }'); //bottom box-top border
  100. addGlobalStyle ('span { color: #90b8f8 !important }'); //text color in comment sections
  101. //for opening posts on an IG page
  102. addGlobalStyle('.JyscU.ePUX4 .UE9AK { background-color: #353941 !important; }'); //upper box color
  103.  
  104. addGlobalStyle('.JyscU.ePUX4 .eo2As { background-color: #353941 !important; }'); //general background color
  105.  
  106. //Main page
  107. addGlobalStyle('.M9sTE { background-color: #353941 !important; }'); //
  108. addGlobalStyle('article._8Rm4L.M9sTE.L_LMM.SgTZ1.ePUX4 { border: 1px solid #999999 !important; }');
  109.  
  110. addGlobalStyle('.DPiy6 { background-color: #353941 !important; }'); //
  111. addGlobalStyle('.b2rUF { border: 1px solid #999999 !important; }');
  112.  
  113. //suggestions
  114. addGlobalStyle('.NP414.ccgHY.GZkEI { background-color: #26282b !important; border: #26282b !important; }'); //background of suggestions pop up
  115.  
  116. //profile page
  117. addGlobalStyle('.JLbVX { background-color: #26282b !important; }'); //background to 'start capturing moments'
  118. addGlobalStyle('.BvMHM.EzUlV { background-color: #26282b !important; }'); //profile settings background
  119. addGlobalStyle('.BvMHM { border: 1px solid #999999 !important; }'); //border color of settings
  120. addGlobalStyle('label { color: #84B3CD !important; }'); //text color
  121. addGlobalStyle('h1.nsKSz { color: #637CDF !important; }'); //text color of header
  122. addGlobalStyle('a.h-aRd.fuQUr { background-color: #353942 !important; }'); //background color when highlighted
  123. addGlobalStyle('.JLJ-B, .p7vTm { color: #72ABFC !important; }'); //text in boxes
  124. addGlobalStyle('.RO68f { background-color: #4B718E !important; }'); //boxes background
  125. addGlobalStyle('.j_2Hd { border: #4B718E !important; color: #999999 !important; }'); //password color
  126. addGlobalStyle('._lz6s { border-bottom: 1px solid #353942 !important; }'); //bottom border of header
  127.  
  128.