tailwind-scrollbar-hide

tailwindcss plugin for hide scrollbar

Usage no npm install needed!

<script type="module">
  import tailwindScrollbarHide from 'https://cdn.skypack.dev/tailwind-scrollbar-hide';
</script>

README

tailwind-scrollbar-hide

Tailwind plugin for hide scrollbars, although the element can still be scrolled if the element's content overflows.

npm npm Dependents (via libraries.io) semantic-release install size

Firefox >=64 Chrome >= 2 Safari >= 4 Internet Explorer >= 10

tailwind-scrollbar-hide animation demo

Live demo

Installation

Install the plugin from npm:

# Using npm
npm install tailwind-scrollbar-hide

# Using Yarn
yarn add tailwind-scrollbar-hide

# Using pnpm
pnpm add tailwind-scrollbar-hide

Then add the plugin to your tailwind.config.js file:

// tailwind.config.js
module.exports = {
  theme: {
    // ...
  },
  plugins: [
    require('tailwind-scrollbar-hide')
    // ...
  ]
}

Usage

Use in you template scrollbar-hide for visual hiding scrollbar

<div class="w-4 scrollbar-hide">...</div>

or restore default value use scrollbar-default

<div class="w-4 scrollbar-hide md:scrollbar-default">...</div>

License

MIT