Sometimes you might find you’ve got tired of ugly browser scrollbars when browsing web pages in daily work. Here’s a list of 10 JavaScript and/or pure CSS libraries that can be used to replace and enhance the native scrollbars.
Originally Published Jan 27 2017, updated Jan 28, 2023
Note: You can also apply your own styles to the native browser scrollbars with the following CSS snippets.
/* width */ ::-webkit-scrollbar { width: 10px; } /* button */ ::-webkit-scrollbar-button { background: #222; } /* Handle */ ::-webkit-scrollbar-thumb { background: #333; } /* Handle on hover */ ::-webkit-scrollbar-thumb:hover { background: #666; } /* Track */ ::-webkit-scrollbar-track { background: #000; } /* The track NOT covered by the handle. ::-webkit-scrollbar-track-piece { background: #000; } /* Corner */ ::-webkit-scrollbar-corner { background: #999; } /* Resizer */ ::-webkit-resizer { background: #111; }
Let’s get started…
1. Performant Custom Scrollbar JavaScript Library – SimpleBar
A simple, standalone JavaScript library that appends a custom scrollbar to any scrollable container which has overflowing content. Works with CSS overflow: auto property and keeps the native scroll behavior.
2. Customizable Scrollbar With Smooth Scroll – smooth-scrollbar
A JavaScript library used to create a customizable, performant scrollbar with smooth scrolling effects for scrollable content.
3. OverlayScrollbars

OverlayScrollbars is a JavaScript library used to create elegant, customizable and themeable scrollbars on any scrollable elements.
4. baron
A small, fast and crossbrowser custom scrollbar with native system scroll mechanic.
5. Vanilla JavaScript Library For Custom Scrollbars – SimpleScrollbar
A simple, lightweight, ES6 compatible vanilla JavaScript library to create a custom scrollbar on your scrollable content on mouse hover.
6. gemini-scrollbar
Custom overlay-scrollbars with native scrolling mechanism for web applications.
7. slim-scroll

Slim-scroll is a Pure JavaScript plugin to replace the native browser scrollbar with one that can be easily customized via CSS.
8. Lightweight Mobile-compatible Custom Scrollbar Library – letmescroll.js
Custom overlay-scrollbars with native scrolling mechanism for web applications.
9. Beautify Native Scrollbar With Custom CSS – Slim-scroll
A Pure JavaScript plugin to replace the native browser scrollbar with one that can be easily customized via CSS.
10. Lightweight Customizable Scrollbar Library – Optiscroll
A lightweight, highly customizable JavaScript library used to create custom horizontal and/or vertical scrollbars while preserving the native scroll behaviors.
More Resources:
Looking for more JavaScript solutions to create custom scrollbars on modern web applications? Here are some resources you might find useful: