Shadcn.io is not affiliated with official shadcn/ui
Music Waveform Editor
A waveform editor UI block for React and Next.js with styled waveform bars, trim markers, zoom controls, selection region, playhead position, and export button built with shadcn/ui and Tailwind CSS
Edit audio waveforms visually with this React and Next.js block. Features a rendered waveform display with amplitude bars, draggable trim start and end markers, a playhead position line, selection highlight region, zoom in and out controls, and an export button. Built with TypeScript, shadcn/ui Button and Badge components, framer-motion entrance animations, and Tailwind CSS. Perfect for audio editing tools, podcast production interfaces, and music production dashboards.
Related Components
Recording Booth Block
Audio recording interface with level meters
Streaming Dashboard Block
Music streaming analytics dashboard
Soundboard Block
Interactive soundboard trigger pad grid
Tour Dates Block
Concert tour dates with ticket status
Podcast Player Block
Podcast episode player with controls
FAQ
Was this page helpful?
Sign in to leave feedback.
Vinyl Store
A vinyl record store block for React and Next.js with record display cards, price tags, condition grades, genre filter tags, add-to-cart buttons, and cart summary footer built with shadcn/ui and Tailwind CSS
Year Wrapped
A year in review music wrapped summary block for React and Next.js with top artist, top song, total minutes, genre breakdown, listening personality, and shareable card built with shadcn/ui and Tailwind CSS