10 Best Custom Scrollbar Plugins In jQuery And Vanilla JS (2026 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 21 2026

Table of contents:

• jQuery Custom Scrollbar Plugins
• Vanilla JS Custom Scrollbar Libraries

jQuery Custom Scrollbar Plugins:

Highly Customizable Custom Overlay Scrollbar Plugin With jQuery

The jQuery OverlayScrollbars plugin provides a simple way to create customizable, themeable overlay scrollbars on any scrollable element while preserving the native scroll functionality.

Features:

• Touch-enabled.
• RTL supported.
• CSS3 animated.
• Cross browser.
• High performance.

[Demo] [Download]

---

Floating Scrollbar For Long Content - jQuery floating-scroll

A jQuery plugin which appends a floating horizontal scrollbar to the bottom of the webpage so the long content (e.g. large table with tons of columns) will always be scrollable as you scroll down.

[Demo] [Download]

---

Cross-browser Custom Scrollbar In JavaScript - jScrollPane

A jQuery plugin to create cross-browser, fully configurable, highly customizable scrollbars on any container elements.

Features:

• Supports both horizontal and vertical scrollbars.
• Supports mouse wheel event.
• Auto scrolls the content when hovering over scroll arrows.
• Auto maintains the position whenever it is reinitialised.
• Fully responsive. Auto reinit on window resize.
• Auto scrolls the content to the correct place on page load. Smooth scroll is supported as well.

[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]

---

Simple Yet Robust Scrollbar Plugin - jQuery sScrollBar

A simple and highly customizable scrollbar jQuery plugin designed to provide an easy-to-implement upgrade over the native browser scrollbar. Supports both horizontal and vertical scrollbars.

Its responsive sizing automatically adjusts the scrollbars to fit containers that change size. This makes the plugin useful for scrollable elements that resize with responsive layouts. 

[Demo] [Download]

---

Vanilla Custom Scrollbar Libraries:

Tiny JavaScript Plugin For Beautifying Scrollbar - perfect-scrollbar

A lightweight JavaScript plugin that allows you to beautify the default scroll bars without changing or adding any style on original elements.

[Demo] [Download]

---

OverlayScrollbars

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

Features:

• Custom Styling: Full control over scrollbar appearance using CSS variables.
• Native Behavior Preservation: Keeps the familiar scroll feel, including mouse wheel, touch, and keyboard navigation.
• Accessibility: Designed with accessibility in mind, not breaking native interactions.
• Cross Browser: Works on modern browsers like Firefox, Chrome, Edge, Safari, and more.
• Framework Agnostic: Vanilla JS core, with official wrappers for React, Vue, Angular, Svelte, and Solid. Also can be used as a jQuery plugin.
• Server-Side Rendering (SSR) Capable: Can run in Node, Deno, and Bun environments.
• Tree-Shaking: Only bundles the code you use, thanks to its plugin system.
• Automatic Updates: Detects content and size changes without polling.
• Supports body element: You can apply it directly to the body.

Demo Download

---

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]

---

Beautify Native Scrollbar With Custom CSS

A Pure JavaScript plugin to replace the native browser scrollbar with one that can be easily customized via CSS.

[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