-
-
Save Xintaur/559da1b2bc05c7b86c00f21c89d8643e to your computer and use it in GitHub Desktop.
Dark scrollbar for Firefox 57. Tested on Windows 10. Fixed element scrollbars and resize on page zoom. Requires https://gist.github.com/Sporif/db6b3440fba0b1bcf5477afacf93f875
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
scrollbar, scrollbar *, scrollcorner { | |
-moz-appearance: none !important; | |
--scrollbar-width: 0.67vw; | |
--scrollbar-height: var(--scrollbar-width); | |
} | |
scrollbar, scrollcorner { | |
background: #282828 !important; | |
} | |
scrollbar[orient="vertical"] { | |
width: var(--scrollbar-width) !important; | |
min-width: var(--scrollbar-width) !important; | |
} | |
scrollbar[orient="horizontal"] { | |
height: var(--scrollbar-height) !important; | |
min-height: var(--scrollbar-height) !important; | |
} | |
scrollbar thumb { | |
background: #646464 !important; | |
} | |
scrollbar thumb:hover, | |
scrollbar thumb:active { | |
background: #00ACED !important; | |
} | |
scrollbar scrollbarbutton { | |
width: var(--scrollbar-width) !important; | |
min-width: var(--scrollbar-width) !important; | |
} | |
scrollbar:hover scrollbarbutton { | |
background-color: #444444 !important; | |
} | |
scrollbar scrollbarbutton:hover { | |
background: #646464 !important; | |
} | |
scrollbar scrollbarbutton:active { | |
background: #00ACED !important; | |
} |
Okay thanks. I can confirm that this works for Firefox 70.0.1 on Windows 10.
Works great, thanks @Xintaur!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The default width of the Firefox scrollbar is 17px, like on most other browsers. The default scrollbar (unlike a custom one) is not affected by resizing tho. I just chose 0.67vw because it was roughly the same size as Sporif's version on a 1080p screen.
If your screen has a different resolution it will have a different size, so just change it to whatever size you need it.