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. }