Di antara kalian yang sering browsing dan mengunjungi website-website seperti TheNextWeb pasti akan melihat scrollbar yang berbeda dan terlihat keren seperti gambar dibawah ini.

Gimana, terlihat unik dan bagus kan? di postingan kali ini saya akan memberikan tutorial merubah CSS Desain Scrollbar pada webkit browser seperti Chrome dan Safari, sehingga jika website anda di akses dengan menggunakan browser itu akan berubah scrollnya menjadi lebih bagus. dan mungkin bagi penggila web desain sangat membutuhkan webnya jika diakses memperlihatkan Scrollbar yang berbeda. caranya cukup mudah, copy script css dibawah ini dan paste di style css template yang anda gunakan, semisal wordpress ya copy aja ke style.css di folder theme yang sedang digunakan.

::-webkit-scrollbar {
    height: 12px;
    width: 12px;
    background: #000;
}
::-webkit-scrollbar-thumb {
    background: #393812;
    -webkit-border-radius: 1ex;
    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
}
::-webkit-scrollbar-corner {
    background: #000;
}

Saya mencoba mempraktekan di website sederhana saya centerklik.com dengan memasang css tersebut diatas, dan hasilnya seperti screnshot dibawah ini. 

Anda Terbantu artikel ini? Silahkan bergabung dengan centerklik di Twitter dan Google+.