FRSOURCE / light-scrollbar

Light-scrollbar allows you to build custom scrollbar, light scrollbar with just one line of code

Light Scrollbar - minimalistic light plugin to create custom scrollbar! 💪

Getting Started · Documentation · File an Issue · Have a question or an idea?

Light, small library that allows create custom scrollbar.
Mobile & desktop-friendly
Not rebuilding scrolling experience, just visually represent browser scrollbar
Performant & with small bundle size (less than 2500B!)
Possibility to use `scroll-behavior: smooth`
Published as separate bundles for JS ES5 or modern browsers thanks to microbundle
Written completely in typescript
Published under MIT license

https://www.frsource.org/light-scrollbar

Installation

# npm
npm install @frsource/light-scrollbar

# Yarn
yarn add @frsource/light-scrollbar

# Pnpm
pnpm add @frsource/light-scrollbar

Modern JS/Typescript

import { attach } from "@frsource/light-scrollbar";
const scrollingElement = document.querySelector("element-with-overflow-auto");
attach(scrollingElement);

UMD

const scrollingElement = document.querySelector("element-with-overflow-auto");
window.lightScrollbar.attach(scrollingElement);

Documentation

For docs, please visit frsource.org/light-scrollbar

• Getting Started
• API Reference

Demo examples

Check our examples to see how its working!

Questions

Don’t hesitate to ask a question directly on the discussions board!

Changelog

Changes for every release are documented in the release notes and CHANGELOG file.

Contribute

Development happens in docs, so run pnpm docs:dev which runs microbundle and vitepress docs. Tests can be done in cypress running pnpm cy which runs microbundle and cypress

License

MIT

Copyright (c) 2022-present, Szymon Dziewoński, FRSOURCE