Scrollbar track thinner than thumb

Question

I am trying to style a scrollbar using css and I want to achieve the following look (ignore the background):

In other words, I want the thumb to be thicker than

Answer 1

Pure css solution

    .item-container::-webkit-scrollbar {
         background-image: linear-gradient(to right,white 50%, grey 50%,white 51%);
    }

    .item-container::-webkit-scrollbar-thumb {
        background-color: grey;
        border-radius: 10px;
    }

    .item-container{
      overflow: auto;
      height: 200px;
      width: 200px;
    }

    .item-container div{
      height: 100px;
    }

    

      
item
      
item
      
item
      
item
      
item
      
item
      
item
      
item
      
item
      
item
      
item
      
item
      
item