☰

Dark Minimalistic Scrollbar

Customizable scrollbar for WebKit based browsers (Chrome, Opera).

  1. /* ==UserStyle==
  2. @name         Dark Minimalistic Scrollbar
  3. @namespace    https://github.com/pabli24/DMScrollbar
  4. @version      0.1.3
  5. @description  Customizable scrollbar for WebKit based browsers (Chrome, Opera).
  6. @author       Pabli
  7. @license      CC-BY-SA-4.0
  8. @homepageURL  https://github.com/pabli24/DMScrollbar
  9. @supportURL   https://github.com/pabli24/DMScrollbar/issues
  10. @preprocessor uso
  11. @var color border "border" #484848
  12. @var color bar "bar" #383838
  13. @var color hover "hover" #282828
  14. @var color active "active" #181818
  15. @var color corner "corner" #383838
  16. @var color bg "background" rgba(0,0,0,0)
  17. @var number width "width (px)" [10,0,null,null,'px']
  18. @var number b "border (px)" [2,0,null,null,'px']
  19. @var number br "border-radius (px)" [10,0,null,null,'px']
  20. ==/UserStyle== */
  21. @-moz-document regexp(".*") {
  22. html::-webkit-scrollbar {
  23. 	width: /*[[width]]*/ !important;
  24. 	height: /*[[width]]*/ !important;
  25. 	max-width: /*[[width]]*/ !important;
  26. 	max-height: /*[[width]]*/ !important;
  27. 	min-width: /*[[width]]*/ !important;
  28. 	min-height: /*[[width]]*/ !important;
  29. }
  30. html::-webkit-scrollbar-thumb {
  31. 	background-color: /*[[bar]]*/ !important;
  32. 	border: /*[[b]]*/ solid /*[[border]]*/ !important;
  33. 	border-radius: /*[[br]]*/ !important;
  34. }
  35. html::-webkit-scrollbar-track {
  36. 	background-color: /*[[bg]]*/ !important;
  37. }
  38. html::-webkit-scrollbar-thumb:hover {
  39. 	background: /*[[hover]]*/ !important;
  40. 	border: /*[[b]]*/ solid /*[[border]]*/ !important;
  41. }
  42. html::-webkit-scrollbar-thumb:active {
  43. 	background: /*[[active]]*/ !important;
  44. }
  45. html::-webkit-scrollbar-corner {
  46. 	background: /*[[corner]]*/ !important;
  47. }
  48. }