To convert audio to a waveform, decode the file in the current browser tab, divide the resulting samples into equal-width index ranges, record the minimum and maximum amplitude found in each range across every accepted channel, and draw one vertical SVG line between those two values per range. The output is a static, scalable SVG peak image whose horizontal axis is time and whose vertical extent encodes the largest positive and negative sample amplitude that occurred inside each bucket. Because the picture is vector rather than a raster export, it stays sharp at any zoom level and can be opened directly in any SVG-aware editor without further conversion. The same string of numbers and tags that appears in the preview is the file you download, which makes the result fully inspectable before it is reused in another project. The Audio Waveform Generator performs all decoding, peak extraction, and SVG creation in the local browser tab, so the source audio and the finished image never leave the device. Nothing is uploaded, no rasterization step happens server-side, and the finished SVG is a plain text file with one background rectangle and one group of peak lines.
What Converting Audio to a Waveform Actually Means
The phrase "convert audio to waveform" is usually shorthand for turning a sound file into a still picture that summarizes its amplitude over time. The visual is not the audio signal itself; it is a deliberately compressed overview in which every horizontal pixel column corresponds to a small range of decoded samples and reports the largest swing that range contained. The result is sometimes called a peak waveform or amplitude envelope, and it is the standard format used by podcast players, video editors, and audio hosting sites to preview a recording.
The conversion follows three rules that distinguish a true peak image from a sampled one. First, the decoded samples are split into evenly spaced frame ranges using integer boundaries, so the first range starts at frame zero and the last range ends at the final decoded frame. Second, each range contributes one column whose vertical line stretches from the lowest finite sample in that range to the highest finite sample, including contributions from every channel. Third, defensive values outside the -1 to 1 range are clamped to those bounds so that a corrupted sample cannot blow up the picture.
Because the image is built from those numbers, two files that sound different can still produce visually similar peaks, and two files that look almost identical on screen can differ in loudness, frequency balance, and dynamics. The picture tells you where amplitude moved and how far it reached, not how the audio was perceived.
Input Limits and Supported Audio Formats
Before conversion starts, the file must clear a small set of hard limits that protect the browser tab from runaway memory use. Web Audio reads the selected file only when the current browser and operating system actually support its real codec, so an MP3, WAV, M4A, AAC, Ogg, WebM, or FLAC label is necessary but not sufficient. A renamed or corrupt file will be rejected as a whole rather than silently truncated.
| Property | Accepted range |
|---|---|
| Compressed file size | at most 50 MiB |
| Decoded duration | at most 5 minutes |
| Channel count | 1 through 8 |
| Sample rate | 8,000 Hz to 192,000 Hz |
| Total channel samples | at most 30,000,000 |
These limits matter because a small compressed file can decode into a much larger floating-point channel array. A three-minute clip at 48 kHz stereo is roughly 8.6 million channel samples per channel, while a four-minute clip at 96 kHz in 5.1 surround pushes the same metric well past 100 million. When any limit is exceeded, the waveform is rejected outright; the tool does not silently draw from only the beginning of the file.
Converting Audio to a Waveform Step by Step
The whole conversion runs through one screen of controls. Each step below produces a visible change in the preview and is reversible by picking a replacement file or changing an option, after which any stale object URL is revoked so an older image cannot appear to represent new inputs.
- Open the Audio Waveform Generator in your browser tab and pick one audio file from your device. Wait for the page to confirm that the file decoded successfully.
- Enter an SVG width between 320 and 1600 pixels and a height between 120 and 600 pixels. The chosen size locks the visible dimensions of the result and the number of peak columns that can be drawn.
- Set a six-digit hex background color and a six-digit hex waveform color using the browser color controls. Filenames and embedded metadata tags are never read for color values.
- Press the generate action to extract the peak envelope locally. The page reports the decoded frame count and the number of peak columns that were actually drawn.
- Inspect the preview image and, if needed, expand the SVG text inspector to verify the exact rectangle, line count, and pixel coordinates.
- Download the SVG. The downloaded file is identical to the inspected string and contains one background rectangle plus a group of peak lines.
The column count reported on screen is the smaller of the requested image width, 1000, and the decoded frame count. A short clip therefore never invents more independent measurements than it contains, while a long clip stays within a bounded SVG and processing budget.
How Peak Columns Are Calculated Locally
The peak column logic is small enough to reason about on paper. Suppose a 4-second stereo clip decodes to 192,000 frames per channel, for a total of 384,000 channel samples. The minimum possible column count is min(1600, 1000, 192000) = 1000, so the generator prepares 1000 buckets. Each bucket covers an integer range of 192 frames (192000 ÷ 1000), with the first bucket starting at frame zero and the last bucket reaching the final decoded frame.
For every bucket, the tool scans all decoded channels and keeps the smallest finite sample and the largest finite sample. If one channel swings negative and another swings positive, the column stretches from the negative extreme to the positive extreme, which preserves short transients more honestly than averaging channels into a new signal. Non-finite values such as NaN or Infinity are skipped rather than propagated, and out-of-range numbers are clamped to -1 and 1 so a single bad sample cannot push the picture off-canvas.
Mapping those numbers to SVG coordinates is fully deterministic. The vertical center sits at half the requested height, full-scale positive samples extend to 45 percent of the height above that center, and full-scale negative samples extend 45 percent below it. A 5 percent margin remains at the top and bottom. Columns are placed at evenly spaced horizontal positions across the requested width, so the picture is symmetric and predictable regardless of the input. The behavior of the underlying Web Audio AudioBuffer interface, which supplies those decoded samples, is the only audio dependency in the conversion path.
Inspecting, Editing, and Downloading the SVG
The SVG that downloads is plain text, not a binary raster. It contains exactly one background rectangle for the chosen fill color and one group of vertical lines, one per peak column. Because coordinates are computed from validated numbers and the two chosen colors, you can open the file in any SVG-aware editor, change stroke widths, reposition labels, or recolor individual lines without re-running the conversion.
The page shows the exact generated SVG string in an expandable inspector, and the download uses that identical string. If you regenerate with different dimensions or colors, the previous string is discarded and the prior object URL is revoked so the older image cannot appear to represent the new inputs. That guarantees the file on disk matches what you saw on screen.
Vector scaling is the main reason the output is SVG rather than PNG or JPEG. A 1600-pixel-wide image stays sharp when placed in a 4K video frame or printed at poster size, while a raster export would either pixelate or balloon in file size. The same audio can be exported at any width up to 1600 px by rerunning the conversion with a new width value; the SVG text grows or shrinks to match, but the column count is the smaller of the requested width, 1000, and the decoded frame count, so a different width changes the bucket boundaries and the per-column peak values.
Reading the Result Without Misinterpreting It
The picture is honest about amplitude range and silent about everything else. Time runs left to right as expected, but the vertical axis is sample amplitude range in a single bucket, not frequency, not loudness, and not a calibrated meter. Diagnosing hearing, equipment clipping history, phase relationships, or mastering compliance from this image is not supported.
Two recordings can show similar peaks while sounding very different because perceived loudness depends on duration, frequency balance, dynamics, and playback conditions. The waveform also does not separate channels into left and right lanes, average them into a new audio signal, or preserve channel identity visually; it shows one combined peak overview that may take its minimum from one channel and its maximum from another. When separate channel waveforms are required, open the file in an audio editor that exposes each channel as its own track and export from there.
If decoding fails because the file is unsupported, corrupt, or empty, or because the file exceeds one of the limits listed above, the generator returns an error and draws nothing. Picking a smaller file, trimming it with a tool that exports a local PCM16 WAV such as the Audio Cutter, or re-encoding to a codec the browser actually decodes are the standard recovery paths. When the same error keeps appearing, the Generate Audio Waveform Not Working: A Browser Fix guide walks through codec checks, MIME mismatches, and stale object URL behavior.