audio/ui is a component library for building audio interfaces in React applications. Built on top of shadcn/ui, we provide accessible, composable components that you can copy, paste, and customize to fit your needs.
Current Status
We're actively building and improving audio/ui. Here's what's available today:
Components
- Audio Player: A fully-featured, composable audio player with queue management, shuffle, repeat modes, and volume control
- Controls: Knob, Fader, XY Pad, and Transport primitives for building custom audio interfaces
- Channel Strip: Layout patterns for mixer-style columns combining controls, labels, and readouts
Library
- Audio Store: A Zustand-based state management solution for audio playback with localStorage persistence
- HTML Audio: Core singleton for loading and controlling HTML5 audio with retry logic and event handling
Blocks
- Pre-assembled Patterns: Ready-to-use audio player and channel strip patterns that combine multiple components — browse the component catalog
What's Next
- More Audio Components: Additional audio-specific UI patterns and controls
- Enhanced Player Features: Advanced playback controls, playlist management, and audio visualization
- Visualization Components: Waveform displays, spectrum analyzers, and other audio visualizations
- Radix UI Support: A Radix-based variant of the component set, alongside the current Base UI implementation
Contributing
We're building this in the open and welcome contributions! Whether it's bug reports, feature requests, or code contributions, we'd love to have you involved.
Check out our GitHub repository to get started.