About MP3 Sound Player
Overview
A polished audio player component built on WaveSurfer.js, designed for podcasters, musicians, and content creators who need a professional playback experience in Framer.
Audio Source
Load tracks via direct file upload or external URL. Supports MP3, WAV, and M4A formats with automatic waveform generation.
Visualization Options
Choose between bar-style or continuous wave visualization. The bar style includes contrast controls for dynamic range emphasis, while both styles support amplification adjustment. Configure bar width, gap, and corner radius for precise aesthetic control.
Playback Features
Standard playback controls with optional autoplay on preview. Time display shows elapsed time or remaining time countdown. Playback cursor with configurable width and color provides visual tracking.
Customization
Full typography control for track title, artist name, and timer display. Independent color controls for waveform, progress indicator, button, and all text elements. Optional background image or solid color fill.
Technical Notes
Single instance playback enforced—starting one player automatically pauses others on the page.
Built with WaveSurfer.js 7.8.10 for reliable cross-browser performance.