Scrollbar personalizada CSS

Para personalizar una scrollbar necesitamos utilizar la pseudoclase ::-webkit con la que podemos editar muchas cosas.
Para empezar seleccionamos la scrollbar y le pondremos el ancho que queremos:

#contenedor::-webkit-scrollbar{
    width: 7px;
}

Como podéis ver la scrollbar habrá desaparecido así que vamos a seleccionarla para ponerle un fondo:

#contenedor::-webkit-scrollbar-thumb{
    background-color: #2ECCFA;
}

Una vez que tenemos el fondo le voy a poner un border radius para que no sea tan cuadrada:

#contenedor::-webkit-scrollbar-thumb{
    background-color: #2ECCFA;
    border-radius: 10px;
}

Ahora ya podéis ver como queda.
Si queréis más información os recomiendo esta web.
Cualquier duda me la preguntáis.