https://github.com/satelllte/react-knob-headless

🎛️ Unstyled & accessible knob primitive for React.
https://github.com/satelllte/react-knob-headless

dial-knob headless-ui headlessui-react knob react-dial-knob react-knob react-rotary-knob rotary rotary-knob slider

Last synced: about 1 year ago
JSON representation

🎛️ Unstyled & accessible knob primitive for React.

• Host: GitHub
• URL: https://github.com/satelllte/react-knob-headless
• Owner: satelllte
• License: mit
• Created: 2023-09-24T13:25:02.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-06-01T01:50:28.000Z (about 2 years ago)
• Last Synced: 2025-03-24T17:52:29.833Z (about 1 year ago)
• Topics: dial-knob, headless-ui, headlessui-react, knob, react-dial-knob, react-knob, react-rotary-knob, rotary, rotary-knob, slider
• Language: TypeScript
• Homepage: https://react-knob-headless.pages.dev
• Size: 328 KB
• Stars: 62
• Watchers: 2
• Forks: 6
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# 🎛️ React Knob Headless

[![Version](https://img.shields.io/npm/v/react-knob-headless?style=flat&colorA=000000&colorB=000000)](https://npmjs.com/package/react-knob-headless)

[![docs](https://img.shields.io/badge/docs-f5f5f5?style=flat&colorA=000000&colorB=000000)](https://react-knob-headless.pages.dev)

Unstyled & accessible **knob** primitive for React.



## Features

- Knob primitive component. Tailored for audio applications in React.

- Unstyled. Can be styled with any styling solution: Vanilla CSS, Tailwind, Emotion, anything.

- Smooth drag gesture, which supports mouse & touch devices. Powered by [@use-gesture](https://use-gesture.netlify.app/).

- Accessibility support. Follows [ARIA Slider](https://www.w3.org/WAI/ARIA/apg/patterns/slider/) pattern.

## Documentation

📚 **[react-knob-headless.pages.dev](https://react-knob-headless.pages.dev/)**

## Installation

```sh

npm install --save-exact react-knob-headless

```