Skip to main content
Código duplicado no início da resposta
Fonte Link

Para navegadores webkit (Chrome, Safari, Opera 15+):

    ::-webkit-scrollbar              { /* 1 */ }
    ::-webkit-scrollbar-button       { /* 2 */ }
    ::-webkit-scrollbar-track        { /* 3 */ }
    ::-webkit-scrollbar-track-piece  { /* 4 */ }
    ::-webkit-scrollbar-thumb        { /* 5 */ }
    ::-webkit-scrollbar-corner       { /* 6 */ }
    ::-webkit-resizer                { /* 7 */ }

Para navegadores webkit (Chrome, Safari, Opera 15+):

Para navegadores webkit (Chrome, Safari, Opera 15+):

    ::-webkit-scrollbar              { /* 1 */ }
    ::-webkit-scrollbar-button       { /* 2 */ }
    ::-webkit-scrollbar-track        { /* 3 */ }
    ::-webkit-scrollbar-track-piece  { /* 4 */ }
    ::-webkit-scrollbar-thumb        { /* 5 */ }
    ::-webkit-scrollbar-corner       { /* 6 */ }
    ::-webkit-resizer                { /* 7 */ }

Para navegadores webkit (Chrome, Safari, Opera 15+):

Para navegadores webkit (Chrome, Safari, Opera 15+):

Fim da Recompensa com 50 pontos de reputação concedidos por Leo Letto
Fonte Link

Para navegadores webkit (Chrome, Safari, Opera 15+):

    ::-webkit-scrollbar              { /* 1 */ }
    ::-webkit-scrollbar-button       { /* 2 */ }
    ::-webkit-scrollbar-track        { /* 3 */ }
    ::-webkit-scrollbar-track-piece  { /* 4 */ }
    ::-webkit-scrollbar-thumb        { /* 5 */ }
    ::-webkit-scrollbar-corner       { /* 6 */ }
    ::-webkit-resizer                { /* 7 */ }

Para navegadores webkit (Chrome, Safari, Opera 15+):

    ::-webkit-scrollbar              { /* 1 */ }
    ::-webkit-scrollbar-button       { /* 2 */ }
    ::-webkit-scrollbar-track        { /* 3 */ }
    ::-webkit-scrollbar-track-piece  { /* 4 */ }
    ::-webkit-scrollbar-thumb        { /* 5 */ }
    ::-webkit-scrollbar-corner       { /* 6 */ }
    ::-webkit-resizer                { /* 7 */ }

Para criar um scrollbar exatamente como da tua pergunta seria algo deste genero:

    ::-webkit-scrollbar-track {
        background-color: transparent;
    }

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

    ::webkit-scrollbar-thumb {
        background: #dad7d7;
     }

Conforme o snippet, abra no Navegador Chrome ...

.container {
    height:200px;
    overflow: auto;
    width: 200px;
    border-bottom: 1px solid #D4D4D4;
    background-color: blue;
}

.container::-webkit-scrollbar-track {
    background-color: transparent;
}
.container::-webkit-scrollbar {
    width: 10px;
}
.container::-webkit-scrollbar-thumb {
    background: #dad7d7;
}
<div class="container">
    <div class="content" style="height:600px;">fdsf</div>
</div>