Waveform Generator
Visualize audio waveforms and export as PNG or SVG. Bars, line and mirror styles. Free, browser-based.
Drop an audio file or click to browse
MP3, WAV, OGG, FLAC, AAC
About Waveform Generator
Waveform visualizations have become a staple of podcast artwork, music single covers, promotional graphics, and social media content for audio creators. A waveform gives visual weight and context to audio content — it tells the viewer immediately that this post, image, or card is about sound. Our Waveform Generator renders any audio file as a customizable waveform graphic that you can export for immediate use in your creative work.
The tool decodes audio using the Web Audio API and renders the waveform using Canvas, with full control over visual style. Choose between three styles: bars (individual vertical bars), line (a continuous wave path that follows the signal above and below the centre) and mirror (bars reflected into a faded copy below the centre line, the look most associated with music artwork). Customize the foreground and background colors to match your podcast branding or album color palette, and set the bar width anywhere from 1 to 6 pixels — thin bars read as a dense, detailed texture, thick bars as a bold graphic element.
Output size comes from presets: 800, 1200, 1920 or 3000 pixels wide by 200, 300, 400 or 600 pixels tall. All of them are landscape, which suits banners, headers, episode cards and share images rather than square artwork. Changes to style, colour, bar width and dimensions take effect when you press Apply, so you can set several options at once and redraw a single time.
SVG export is ideal for designs that need to scale across different print sizes or that will be further refined in Figma, Illustrator, or Inkscape, and it follows whichever style you picked — a line waveform exports as a vector path, bars and mirror as rectangles. PNG export with a transparent background works well when you need to composite the waveform over a photograph or design element in another tool.
How to Use Waveform Generator
- 1Drop an audio file on the upload area or click to browse — MP3, WAV, OGG, FLAC and AAC all work.
- 2The file is decoded in your browser and the waveform renders automatically from the amplitude data.
- 3Choose the waveform style — Bars, Line or Mirror — using the style selector.
- 4Adjust the foreground and background colors to match your branding, or tick Transparent to drop the background entirely.
- 5Set the bar width and pick the output width and height from the size presets.
- 6Click "Apply" to redraw the canvas with your settings — style, colour and size changes take effect there.
- 7Click "Download PNG" or "Download SVG" to save the waveform graphic.
Use Cases
- →Create a waveform visualization for a podcast episode thumbnail or social media share card
- →Generate waveform artwork for a music single, EP, or album promotional graphic
- →Add a waveform element to a blog post, article, or web page about audio content
- →Export a high-resolution SVG waveform for further refinement in Figma or Illustrator
- →Create branded waveform templates for consistent visual identity across all episodes
- →Generate waveform graphics for YouTube thumbnails, Spotify Canvas, or streaming platforms
Tips
- ✓SVG exports are infinitely scalable — use them for print, large-format banners, or editing in vector tools
- ✓The number of bars comes from the output width and bar width, not from the length of the audio — so a long file is averaged into the same number of bars and looks flatter
- ✓Adjust the foreground and background colors to match your exact podcast or music brand palette
- ✓Use a transparent PNG background to composite the waveform over a photo in Photoshop or Figma
- ✓Bar-style waveforms look more digital and modern; line-style looks more organic and minimal
- ✓Mirror style reflects a faded copy below the centre line — the symmetric look most used on album and single artwork
- ✓For a cleaner visual, use only the first 30–60 seconds of audio rather than the full episode
- ✓Remember to press Apply after changing settings — the canvas redraws there, not while you are still adjusting
- ✓A narrow bar width of 1–2 px gives a dense, detailed texture; 5–6 px reads as a bold graphic element
- ✓Export at 3000 px wide when the waveform has to survive a retina display or a printed banner
- ✓The size presets are all landscape, so crop or place the export on your own canvas if you need a square graphic
- ✓Ticking Transparent removes the background from both exports — the PNG carries a real alpha channel and the SVG has no background rectangle
- ✓Every export uses the first audio channel, so a stereo file is drawn from its left channel
Frequently Asked Questions
Any format your browser can decode: MP3, WAV, OGG, FLAC, AAC, M4A. Audio is decoded locally using the Web Audio API — files are never uploaded.
Bars mode draws vertical rectangles representing amplitude. Line mode draws a continuous waveform trace. Mirror mode draws bars reflected across the center, creating a symmetric look popular for music artwork.
PNG exports a raster image from the canvas at the exact pixel size you picked. SVG exports a vector file — infinitely scalable, and usually far smaller. Both exports follow the style you selected, so a Line waveform exports as a vector path and Bars and Mirror export as rectangles.
Yes. Tick the Transparent checkbox under the Background color and click Apply. The background fill is then skipped entirely, so the PNG carries a real alpha channel and the SVG has no background rectangle — ready to composite over a photo in Figma or Photoshop.
Yes. You can set any foreground and background color, or drop the background entirely. Width options are 800, 1200, 1920 and 3000 px; height options are 200, 300, 400 and 600 px. All of the presets are landscape, sized for banners, headers and share cards rather than square artwork.
The Apply button redraws the canvas with the current settings. Changes to style, colors, bar width, dimensions, or the transparent background option only take effect after clicking Apply.
No — the opposite. The number of bars is set by the output width and bar width, not by the length of the audio, so a long file is averaged into the same number of bars and comes out looking flatter. For more visible detail, export wider or use a shorter excerpt, such as the first 30–60 seconds.
The waveform image is generated from your own audio, so you own the visual output. boxtool.io places no restrictions on its use.