CSS

scrollbar thumb height css

::-webkit-scrollbar-button {
  height: 12px;
}
::-webkit-scrollbar {
    width: 12px;
}
/* Track */
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(255,0,0,0.8);
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb:window-inactive {
background: rgba(255,0,0,0.4);
}

set scrollbar width css

::-webkit-scrollbar {
    width: 2em;
    height: 2em
}
::-webkit-scrollbar-button {
    background: #ccc
}
::-webkit-scrollbar-track-piece {
    background: #888
}
::-webkit-scrollbar-thumb {
    background: #eee
}​

scrollbar height css

::-webkit-scrollbar-button {
  height: 12px;
}

css scrollbar width

/* The syntax, with all the available styling */
(selected-element)::-webkit-scrollbar {
  width: 16px;
  background: transparent;
  display: none;
}
(selected-element)::-webkit-scrollbar-track {
  background: whitesmoke;
  border-radius: 3px;
}
(selected-element)::-webkit-scrollbar-thumb {
  background: tomato;
  border-radius: 10px;
}

/* A modern way of doing this */
selected-element {
  scrollbar-width: thin; /* 'thin' or any usual number measurements like '5px' */
  scrollbar-color: <thumb-color> <track-color>; /* Use normal color system i.e rgb or hex or hsl */
}