CSS Tricks: Custom styling for your scrollbars

Here is the simple code I use to style scrollbars in a web page. Simply add this code to your stylesheet:

::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 8px;
   background:#A020F0;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
  background:#fff;
}

And customize it to fit the design that you want!