CODE EXAMPLE FOR CSS

webkit-scrollbar-button css

/* Scrollbar style for Chrome */

/* Track */
::-webkit-scrollbar
{
  width: 14px;
  height: 14px;
}

::-webkit-scrollbar-track
{
  background: #303030;
  border: solid 2px rgba(33,33,33,0.5);
}


/* Thumb */
::-webkit-scrollbar-thumb
{
  background: #404040;
}

::-webkit-scrollbar-thumb:hover
{
  background: #505050;
}

::-webkit-scrollbar-thumb:active
{
  background: #404040;
}

::-webkit-scrollbar-thumb:vertical
{
  border-top: solid 2px rgba(33,33,33,0.5);
  border-bottom: solid 2px rgba(33,33,33,0.5);
}

::-webkit-scrollbar-thumb:horizontal
{
  border-right: solid 2px rgba(33,33,33,0.5);
  border-left: solid 2px rgba(33,33,33,0.5);
}


/* Buttons */
::-webkit-scrollbar-button
{
  border-style: solid;
  height: 16px;
  width: 16px;
}


/* Up */
::-webkit-scrollbar-button:vertical:decrement
{
  border-width: 0 7px 14px 7px;
  border-color: transparent transparent #404040 transparent;
}

::-webkit-scrollbar-button:vertical:decrement:hover
{
  border-color: transparent transparent #505050 transparent;
}


/* Down */
::-webkit-scrollbar-button:vertical:increment
{
  border-width: 14px 7px 0 7px;
  border-color: #404040 transparent transparent transparent;
}

::-webkit-scrollbar-button:vertical:increment:hover
{
  border-color: #505050 transparent transparent transparent;
}


/* Left */
::-webkit-scrollbar-button:horizontal:decrement
{
  border-width: 7px 14px 7px 0;
  border-color: transparent #404040 transparent transparent;
}

::-webkit-scrollbar-button:horizontal:decrement:hover
{
  border-color: transparent #505050 transparent transparent;
}


/* Right */
::-webkit-scrollbar-button:horizontal:increment
{
  border-width: 7px 0 7px 14px;
  border-color: transparent transparent transparent #404040;
}

::-webkit-scrollbar-button:horizontal:increment:hover
{
  border-color: transparent transparent transparent #505050;
}