Home

Awesome

unocss-preset-scrollbar-hide

UnoCSS preset for hide scrollbars, although the element can still be scrolled if the element's content overflows. Part of the UnoCSS Community Presets.

npm npm Dependents (via libraries.io) install size

<!-- [![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release) -->

unocss-preset-scrollbar-hide animation demo

Live demo

Installation

Install the preset from npm:

# Using npm
npm install unocss-preset-scrollbar-hide

# Using Yarn
yarn add unocss-preset-scrollbar-hide

# Using pnpm
pnpm add unocss-preset-scrollbar-hide

Then add the plugin to your config file:

// unocss.config.ts
import { presetUno } from 'unocss'
import { presetScrollbarHide } from 'unocss-preset-scrollbar-hide'

export default defineConfig({
  // ...
  presets: [
    presetUno(),
    // ...
    presetScrollbarHide()
  ],
})

Usage

Use in you template scrollbar-hide for visual hiding scrollbar

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

License

MIT