10 Best Custom Scrollbar Plugins In jQuery And Vanilla JS (2023 Update)

These 10 Best Custom Scroll Bar plugins enable you to beautify and enhance the native & ugly browser scrollbars.

Some of these plugins also supports scrollable container and horizontal scrollbars. I hope you like it.

YOU MIGHT NOT NEED JavaScript! You can also apply your own CSS styles to the native browser scrollbars the ::-webkit-scrollbar CSS pseudo-element.

/* 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;
}

Originally Published Dec 22 2017, updated Jan 15 2023

Table of contents:

• jQuery Custom Scrollbar Plugins
• Vanilla JS Custom Scrollbar Libraries

jQuery Custom Scrollbar Plugins:

jQuery Custom Scrollbar Plugin - malihu

malihu is a jQuery plugin that allows you to beautify your content scrollbar with CSS and jQuery UI.

[Demo] [Download]

---

Mobile-friendly Custom Scrollbar Plugin With jQuery - NiceScroll

An easy yet robust jQuery plugin that allows to append pretty nice, touch-enabled and highly customizable scrollbar to any scrollable area such as browser window, DIV container, iframe, textarea and much more.

[Demo] [Download]

---

nanoScrollerJS - Mac OS X Lion-Styled Scrollbars

A jQuery Plugin that allows you to create Mac OS X Lion-Styled Scrollbars for your website. It utilizes native scrolling and works with the iPad, iPhone, and some Android Tablets.

[Demo] [Download]

---

Facebook-like jQuery Scrollbar Plugin - slimScroll

A simple and lightweight jQuery plugin for transforming any div into a scrollable area with a nice Facebook-Like scrollbar.

[Demo] [Download]

---

Mac OS X Lion Style Scrollbar Plugin For jQuery - Lionbars

A jQuery plugin that add a Mac OS X Lion style scrollbar to your html container containing overflowed long content.

[Demo] [Download]

---

Vanilla Custom Scrollbar Libraries:

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.

[Demo] [Download]

---

Customizable Scrollbar With Smooth Scroll – smooth-scrollbar

A JavaScript library used to create a customizable, performant scrollbar with smooth scrolling effects for scrollable content.

[Demo] [Download]

---

OverlayScrollbars

OverlayScrollbars is a JavaScript library used to create elegant, customizable and themeable scrollbars on any scrollable elements.

Demo Download

---

baron

A small, fast and crossbrowser custom scrollbar with native system scroll mechanic.

[Demo] [Download]

---

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.

[Demo] [Download]

---

Conclusion:

Seeking more jQuery plugins or JavaScript libraries to create awesome Custom Scrollbars on the web & mobile? See jQuery Scrollbar and JavaScript Scrollbar sections for more details.

See also:

• 10 Best Custom Scrollbar JavaScript Libraries