Custom Scroll Bar

Simple
Custom Scroll Bar

Want to make your website just that little bit fancier with a custom scrollbar?

To change the scrollbar across all pages on your website, add this code to the </body> section of your Webflow website project settings.

<style>
/* Width */
::-webkit-scrollbar {
 width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
 box-shadow: inset 0 0 5px grey;
 background: #f1f1f1;
 border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
 background: #888;
 border-radius: 10px;
}

/* Handle Hover */
::-webkit-scrollbar-thumb:hover {
 background: #555;
}
</style>
Download Assets
See an Example Website

Other Code Snippets

Ready to learn more?

I've worked with countless businesses around the world. Maybe you'll be next.

Get in Touch