https://github.com/reslear/unocss-preset-scrollbar-hide

Hide scrollbars, although the element can still be scrolled if the element's content overflows.
https://github.com/reslear/unocss-preset-scrollbar-hide

Last synced: about 2 months ago
JSON representation

Hide scrollbars, although the element can still be scrolled if the element's content overflows.

• Host: GitHub
• URL: https://github.com/reslear/unocss-preset-scrollbar-hide
• Owner: reslear
• License: mit
• Created: 2023-02-06T15:58:50.000Z (about 2 years ago)
• Default Branch: main
• Last Pushed: 2023-04-28T12:54:02.000Z (almost 2 years ago)
• Last Synced: 2025-01-29T19:55:49.358Z (3 months ago)
• Language: Vue
• Size: 72.3 KB
• Stars: 10
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-unocss - unocss-preset-scrollbar-hide - Hide scrollbars, although the element can still be scrolled. (Presets)
• awesome-unocss - unocss-preset-scrollbar-hide - Hide scrollbars, although the element can still be scrolled. (Presets)
• awesome-unocss - unocss-preset-scrollbar-hide - preset-scrollbar-hide) - Hide scrollbars, although the element can still be scrolled by [@reslear](https://github.com/reslear). (Community / Presets)

README

        
# 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](https://github.com/unocss/unocss#community-presets).

- same as [tailwind-scrollbar-hide](https://github.com/reslear/tailwind-scrollbar-hide)

[![npm](https://img.shields.io/npm/v/unocss-preset-scrollbar-hide)](https://www.npmjs.com/package/unocss-preset-scrollbar-hide)

[![npm](https://img.shields.io/npm/dw/unocss-preset-scrollbar-hide)](https://www.npmjs.com/package/unocss-preset-scrollbar-hide)

[![Dependents (via libraries.io)](https://img.shields.io/librariesio/dependents/npm/unocss-preset-scrollbar-hide?0)](https://www.npmjs.com/package/unocss-preset-scrollbar-hide)

[![install size](https://packagephobia.com/badge?p=unocss-preset-scrollbar-hide)](https://packagephobia.com/result?p=unocss-preset-scrollbar-hide)

![unocss-preset-scrollbar-hide animation demo](https://user-images.githubusercontent.com/12596485/217338621-876e1a28-fd49-4135-b6bf-e2f45da49ca6.gif)

[Live demo](https://reslear.github.io/packages/tailwind-scroll-hide/index.html)

## Installation

Install the preset from npm:

```sh

# 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:

```ts

// 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

```html

...

```


## License

[MIT](./LICENSE)