Audiogram Generator

Knowledge Base

How This Tool Works

Once you upload audio, the tool decodes it and pre-computes a full waveform from the actual sample data, not a placeholder animation. When you click Render, it plays the audio while drawing a live playhead over that waveform onto a canvas, captures the canvas as a video stream, combines it with the real audio track, and records the result to a downloadable WebM file using your browser's built-in MediaRecorder, no upload to a server at any point.

Why WebM, Not MP4

Browsers can only encode video locally using formats they have a native encoder for, which for in-browser recording is WebM (VP8/VP9 video + Opus audio) rather than MP4. Most platforms (YouTube, Twitter/X, LinkedIn) accept WebM directly. For platforms that specifically require MP4, run the download through a free converter or your video editor's import/export once.

Getting a Good Result

• Use a background image with enough contrast that the waveform colour stays visible against it.
• Keep clips under a few minutes, long recordings take proportionally longer to render since the tool plays the full audio in real time while capturing.
• Don't switch browser tabs while rendering. Some browsers throttle canvas updates in background tabs, which can affect capture smoothness.

FAQ

Q: Why does rendering take as long as the audio's actual duration?
A: The tool captures the canvas in real time as the audio plays, the same way a screen recorder works. There's no faster-than-realtime rendering path available through browser APIs for this technique.

Q: Can I use a video file as the background instead of a static image?
A: Not currently. This tool is built around a static image background with an animated waveform overlay.