Hola lucas,
Cambiar la apariencia de las barras de desplazamiento con CSS no es posible en navegadores basados en Webkit, KHTML, o Gecko.
Sólo hay propiedades CSS para Internet Explorer y las barras de desplazamiento. Aquí tienes un ejemplo que puedes probar en varios navegadores:
http://lineadecodigo.com/wp-content/uploads/2007/11/color-barras-scroll.html
En resumen, no es recomendable, no es un estándar y no es cross-browser.
Las propiedades CSS son:
- scrollbar-3dlight-color, color del borde que hace
el efecto 3D en la barra de scroll.
- scrollbar-arrow-color, color de las flechas.
- scrollbar-base-color, es el color genérico a
utilizar por la barra de scroll. Podríamos utilizar únicamente este para
dar color a la barra.
- scrollbar-darkshadow-color, sombra de la barra de
progreso.
- scrollbar-face-color, el color de lo que es
realmente la barra de progreso. Es decir, del bloque que se mueve por la
barra.
- scrollbar-highlight-color, el color del fondo de
la barra.
- scrollbar-shadow-color, son los dos botones sobre
los que podemos pulsar para desplazar la barra.
- scrollbar-track-color, es el color de fondo de la
barra de scroll.
Si aún así quieres cambiar su aspecto en todos los navegadores deberás utilizar alguna solución javascript como esta:
http://www.hesido.com/web.php?page=customscrollbar
Al parecer es compatible también con el iPhone.
Saludos