Integrar Scroll BAr con Fondo

Lo primero decirte que el cambio de las propiedades del scrollbar no es estándar en todos los navegadores, es más, la modificación de los colores solo está soportada de forma directa a través de CSS por Internet Explorer.
Si quieres conseguir ese mismo efecto pero en firefox o similares, tenrás que hacer uso de "simulaciones" de ventanas de scroll hechas con javascript o flash.
Los parámetros que puedes modificar vía CSS son estos:
* Scrollbar-3dlight-color, Es el color de la linea que hace el efecto de relieve en el scrollbar.
* Scrollbar-arrow-color, Determina el color de las flechas superior e inferior.
* Scrollbar-base-color, Es el color dominante de la barra de scroll. Si no defines otro este será el que se tomará como base para todos los elementos del scroll
* Scrollbar-darkshadow-color, Es el color de la sombra de la barra vertical por la que circula el cursor.
* Scrollbar-face-color, El color de la barra vertical que se mueve arriba y abajo (o de forma horizontal).
* Scrollbar-highlight-color, El color de fondo de la barra.
* Scrollbar-shadow-color, Es el color de fondo de los botones, que a efectos prácticos, es el color del símbolo que aparece en el botón de desplazamiento.
* Scrollbar-track-color, El color de fondo del track (de la barra que se desliza sobre el scroll).
Piensa que cualquiera de estas modificaciones deben ir aplicadas a la etiqueta body con lo que tendrás que definier dentro de tu hoja de estilos esta estiqueta incluyendo las modificaciones que quieras para el scrollbar.
Espero que te haya servidor de ayuda.
Saludos.
<!--
<!
body {
scrollbar-arrow-color:yellow;
scrollbar-track-color:aqua; scrollbar-face-color:fuchsia;
scrollbar-highlight-color:yellow;
scrollbar-3dlight-color:orange;
scrollbar-darkshadow-color:darkblue;
scrollbar-shadow-color:gray;
scrollbar-arrow-color:yellow;
scrollbar-track-color:aqua;
}
-->