Skip to content

Instantly share code, notes, and snippets.

@M-Yankov
Forked from Sporif/dark-scrollbar.as.css
Last active January 9, 2020 04:27
Show Gist options
  • Save M-Yankov/d767fbd476b30bc461aabac21f23975d to your computer and use it in GitHub Desktop.
Save M-Yankov/d767fbd476b30bc461aabac21f23975d to your computer and use it in GitHub Desktop.
Dark scrollbar for Firefox 57. Tested on Windows 10. Requires https://gist.github.com/Sporif/db6b3440fba0b1bcf5477afacf93f875
scrollbar, scrollbar *:not(scrollbarbutton), scrollcorner {
-moz-appearance: none !important;
--scrollbar-width: 15px;
--scrollbar-height: var(--scrollbar-width);
}
scrollbar, scrollcorner {
background: #fff !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[orient="horizontal"] thumb {
background: linear-gradient(to bottom, rgb(255,255,125) 0%,rgb(254,215,76) 47%,rgb(248,194,0) 53%,rgb(253,230,145) 86%,rgb(248,194,0) 100%) !important;
}
scrollbar[orient="horizontal"] thumb:hover,
scrollbar[orient="horizontal"] thumb:active {
background: linear-gradient(to bottom, rgb(255,255,87) 0%,rgb(253,208,45) 47%,rgb(224,175,0) 53%,rgb(252,221,106) 86%,rgb(224,175,0) 100%) !important;
}
scrollbar thumb {
background: linear-gradient(to right, rgb(255,255,125) 0%,rgb(254,215,76) 47%,rgb(248,194,0) 53%,rgb(253,230,145) 86%,rgb(248,194,0) 100%) !important;
border: 1px solid lightblue;
border-radius: 15px;
}
scrollbar thumb:hover,
scrollbar thumb:active {
background: linear-gradient(to right, rgb(255,255,87) 0%,rgb(253,208,45) 47%,rgb(224,175,0) 53%,rgb(252,221,106) 86%,rgb(224,175,0) 100%) !important;
border-color: #0494c3;
}
scrollbar scrollbarbutton {
border: 1px solid lightblue;
color: lightblue;
background-color: blue;
height: 20px;
}
scrollbar scrollbarbutton[type="increment"] {
-moz-appearance: none !important;
}
/*
scrollbar:hover scrollbarbutton {
background-color: #444444 !important;
}
scrollbar scrollbarbutton:hover {
background: #646464 !important;
}
scrollbar scrollbarbutton:active {
background: #00ACED !important;
}*/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment