barra de rolagem redonda

1. Primeiro vá em Design -> Editar Html e procure por : 
                                                                 ]]></b:skin>  

2. coloque antes de ]]></b:skin> o código abaixo:    

    

                                                                                   ::-webkit-scrollbar-thumb:vertical {

background: #e7b3c2;

height:50px;

border: 2px solid #fff;

box-shadow: 2px 2px 4px #bebdbd;

-moz-box-shadow: 2px 2px 4px #bebdbd;

-webkit-box-shadow: 2px 2px 4px #bebdbd;

-khtml-box-shadow: 2px 2px 4px #bebdbd;

-moz-border-radius: 10px; /* Para Firefox */

-webkit-border-radius: 10px; /*Para Safari e Chrome */

border-radius: 10px; /* Para Opera 10.5+*/

}

::-webkit-scrollbar-thumb:horizontal {

background-color:#f26d92; height:10px;

border: 1px dashed #fff;

-webkit-box-shadow:0 0 1em #eee; }

::-webkit-scrollbar {height:10px; width:20px; background: url(fundo da barra de rolagem) repeat;

box-shadow: -3px -2px 10px #bebdbd;

-moz-box-shadow: -3px -2px 10px #bebdbd;

-webkit-box-shadow: -3px -2px 10px #bebdbd;

-khtml-box-shadow: -3px -2px 10px #bebdbd;}

  Onde está em vermelho (#e7b3c2) é onde você deve colocar o código da cor da barra

                           Onde está em roxo (#fff) é onde você deve colocar o código da cor da borda, onde na imagem está azul.

                          Onde está em verde (fundo da barra de rolagem) você deve colocar a url da imagem que você quer usar como plano de fundo, onde na imagem está cinza com tracinhos roxos. Mas se você quiser colocar só uma cor e não uma imagem apague url(fundo da barra de rolagem) e coloque o código da cor desejada.

      Alguns fundo para sua barra de rolagem: