Introduction
A collection of wave players and waveform components built with wavesurfer.js and shadcn/ui.
Overview
This package provides:
- Waveform audio players with play/pause, volume, progress, speed control, zoom, and timeline
- A wave recorder component for capturing audio directly in the browser
- Video waveform support for synced audio visualization
- Ready-to-use components crafted with shadcn/ui
- Easy integration into your React/Next.js project
How does it relate to shadcn/ui?
waves-cn follows the same philosophy as shadcn/ui — components are not installed as a package. Instead, you copy the source directly into your project and own it completely. That means no black-box updates, no version conflicts, and full freedom to adapt every component to your design system.
If you already use shadcn/ui, waves-cn slots right in: it shares the same cn utility, Tailwind tokens, and Button primitive so everything feels native from day one. Under the hood, audio rendering is powered by wavesurfer.js — a battle-tested waveform library with a rich plugin ecosystem.
Contribute
Any contributions are welcome! Open an issue or a PR on GitHub if you have any suggestions or improvements.