Audio Waveform Visualizer
When to use: Visualizing audio in any app: music players, recording tools, dashboards, audio editors, and live-input meters.
npx skills add audio-waveform-visualizergit clone https://github.com/skillhub-community/audio-waveform-visualizer.gitDescription
An audio visualization component. Waveform: renders amplitude bars from a decoded audio file (Web Audio decodeAudioData) with a playhead cursor, click-to-seek, and selection region (drag to select a segment, e.g., for trim or loop). Spectrogram: frequency-domain view with a colorful heatmap (FFT via AnalyserNode/OfflineAudioContext), useful for audio forensics or music analysis. LiveMeter: real-time waveform of mic input via AnalyserNode with peak-hold markers.
Performance and rendering: Canvas 2D with a two-pass drawing strategy (pre-render the static waveform to an offscreen canvas, blit + draw playhead each frame) so seeking and scrubbing stay at 60fps even for long files; WebGL path for extremely long tracks. Provides zoom levels (fit, 1:1, x2/x4) with a minimap overview bar. Styling: configurable bar width/gap, color (solid or per-height gradient), and a dark/light theme. Serves as a dependency for other audio skills (TTS, recorder, podcast) which reuse its playhead-sync primitives.
AI Hub
Need a model endpoint?
AI Hub is an OpenAI-compatible endpoint for Cursor, Claude Code, and Agent workflows.
Open AI Hub