How to Make a Private, Release-Ready Music Visualizer Video

Everything runs in your browser, your audio never leaves your device, and you do not need an account to get started. Follow these steps to build a release-ready visualizer with built-in video backgrounds, short social exports, and promo stills in a few minutes.

โฑ About 5 minutes ยท ๐ŸŒ Chrome recommended ยท ๐Ÿ”’ Your files never leave your device ยท ๐Ÿชช No account to try
Open the Music Visualizer Interactive Tutorial
New here? The built-in Interactive Tutorial walks you through every step with voiceover audio and highlighted controls โ€” no reading required, and it matches the current desktop web app workflow.
Start Tutorial
Prefer video walkthroughs? Visit the new ImgTool Music Visualizer YouTube channel for usage tips and quick walkthroughs, including a first basic start-to-finish flow.
Visit channel Watch first basic flow

Step 1 โ€” Upload your audio

1

Choose your audio file

Use the Choose File picker in Upload Audio File and select your track. Supported formats: MP3, WAV, FLAC, AAC, OGG, M4A. Most tracks load in under a second.

Privacy: Your audio is processed entirely in your browser using the Web Audio API. It's never uploaded to any server, which makes the tool useful for unreleased tracks and private release prep.

Step 2 โ€” Choose a visual style

2

Pick from 20+ reactive styles

Open the Style dropdown and try different looks: spectrum bars, waveforms, oscilloscope, rings, particles, neon glows, mirror, tunnel, Wave Print, Cover Side Spectrum, and more. Each responds to your audio's bass, mids, and treble in real time.

Use the Theme selector to change the colour palette. Use Sensitivity and Smoothing sliders to dial in how aggressively the visuals react.

Step 3 โ€” Add a background

3

Image, video, or built-in library

Use Background (Image) for wallpapers and image uploads, then open Background (Video) for loops and playlists. Across those two panels you have three main options:

  • Upload an image โ€” your cover art, a landscape, anything. Use Blur and Dim sliders to soften it behind the visualizer.
  • Built-in video library โ€” choose from ready-to-use animated loops: space, tunnels, neon, fire, ocean, and more.
  • Upload video clips โ€” add them in the Video Playlist section. Arrange them in the timeline and they'll loop behind your visualizer during export. The free lane supports up to 5 clips, with larger playlists available during an active pass.
Built-in video backgrounds are the fastest way to get a polished release asset without hunting for your own media first. If export feels slow, reduce to 720p / 30fps or use a static image instead.

Step 4 โ€” Add text overlays & cover art

4

Artist name, track title, and cover art

Open the Branding / Overlays panel. Use Add title and Add artist / channel to place your track name and artist text as separate overlays. Drag them to position on the canvas, then adjust font, size, opacity, and colour.

In the Cover art section of that panel, upload your album artwork. It appears as a floating image you can drag, resize, and fade.

Use the Custom text option for additional labels โ€” BPM, release date, record label name, etc. If you want a little more detail without another animated layer, the Static pattern overlay options now include dots, guide grid, scanlines, corner brackets, and target frame.

Step 5 โ€” Configure & export your video

5

Use the Device Spec Check, then click Export

In the Export Settings panel, click ๐Ÿ”ฌ Device Spec Check, then use Run check to run a quick browser benchmark and get recommended export settings. Quality-first is the recommended export route on supported desktop Chrome and Edge setups. Legacy real-time remains the fallback on iPad and Safari today. Then set your canvas size (16:9, 9:16, 1:1, or custom) and click Export Video.

720p stays fully free, free HD exports start with the support watermark on, you get 2 watermark-free HD exports before it locks on, and 4K keeps one free watermarked test export per device before paid pass access takes over. Quality-first can save .webm and, on supported Chrome or Edge browsers, .mp4 using H.264/AAC. Use the Quick 720p, Quick 1080p, or Quick 4K buttons when you want a fast shortcut. For focused release-week jobs like Spotify Canvas, X Exports, Release Pack, Promo Still Pack, Batch Tracks, and Playlist Maker, use the quick-launch card above the Visual Style controls. If you build a video playlist, multi-clip background, or long playlist mix, plan around a safe 30fps output today. Playlist Maker is the route for planned YouTube mix videos: export one song file per track in Batch Tracks, then join those files into one final playlist video.

Keep the browser tab visible while exporting โ€” background tabs can be throttled by the browser which causes dropped frames.
Working on a release weekend?

720p stays fully free, free HD exports start with the support watermark on, you get two watermark-free HD exports before it locks on, and 4K keeps one free watermarked test export per device. A paid pass removes that export friction, adds release-week tools like Spotify Canvas, X Exports, Promo Still Pack, Release Pack, Batch Tracks, and Playlist Maker, and keeps the workflow private for unreleased tracks.

Compare passes โ†’ Private workflow โ†’

Performance tips

Advanced features

๐ŸŽฌ

Video Playlist

Add up to 5 video clips on the free lane, with larger playlists available during an active pass. Drag to reorder them in the timeline. Great for music video-style backgrounds, with the current safest output route planned around 30fps.

๐ŸŽž๏ธ

Playlist Maker (beta)

Use Batch Tracks when you need finished videos for multiple songs, then use Playlist Maker when you want one YouTube mix or playlist video from those exported files. Use 720p or 1080p / 30fps for the most reliable joined output.

๐ŸŽ›๏ธ

Audio / EQ

Use the dedicated Audio / EQ panel for bass, mids, treble, and the newer finish controls like gentle compressor, warmth, bass enhance, and presence.

๐Ÿ’พ

Save & Load Projects

Save your setup to a .json file. Load it back later โ€” the app will prompt you to re-link your media files by name.

๐Ÿ”ฌ

Device Spec Check

Runs a quick browser benchmark, then recommends the best export resolution and FPS. Takes about 3 seconds.

๐ŸŒŠ

Ambient Overlay

Add a subtle animated layer on top of everything โ€” starfield, star drift, matrix, retro scanlines, bokeh, rings โ€” to add depth to your visual.

๐Ÿ–ผ๏ธ

Promo Still Pack

Export matching PNG stills from the current visualizer frame: square social image, YouTube thumbnail, and vertical story/reel image. Move the preview to the drop or chorus before exporting for the strongest frame.

๐ŸŽจ

Saved Presets + Fresh Track Template

Save your release defaults locally, then load them into a fresh track so style, layout, built-in backgrounds, and logo setup come back quickly without carrying over the old audio.

Five-minute starter walkthrough

  1. Open the visualizer page. Start at music-visualizer.html. You should see the upload panel, demo tracks, and a resume option if this browser has a saved setup.
  2. Load a track. Choose an MP3, WAV, FLAC, M4A, AAC, or OGG file. The browser decodes the audio locally, so large files can take a few seconds before the waveform and duration are ready.
  3. Pick a style before fine-tuning. Try a spectrum, waveform, ring, particles, or release-card style first. Do broad changes early, then adjust colours, glow, camera shake, cover art, and text once the basic motion feels right.
  4. Choose the output shape. Use 16:9 for YouTube, 9:16 for Reels/TikTok/Spotify Canvas-style clips, 1:1 for square social posts, and 21:9 if you want a cinematic visualizer. Keep the preview simple until you know the device can export it.
  5. Run a short test export. Start with 720p or a short section. Check that the audio is in sync, text is readable, backgrounds loop correctly, and the file opens in your normal video player.
  6. Export the final version. Move to 1080p or 4K only when the test looks right. Chrome or Edge usually gives the most capable quality-first path; Safari and Firefox may need the broader WebM or real-time fallback route.

If you are under time pressure, do not start with every effect enabled. Build the readable version first: audio, style, cover art, title, output shape, and a short test. Once that works, add video backgrounds, extra overlays, and higher resolution. That order catches problems early and avoids wasting a long render on a scene that only needed a small layout fix.

Keyboard shortcuts

Shortcut What it does Notes
Ctrl/Cmd + Z Undo the last visual change Works for supported editor controls, not for browser file selection.
Ctrl/Cmd + Shift + Z Redo a visual change Useful when comparing two colour or layout choices.
Ctrl/Cmd + Y Redo a visual change Alternative redo shortcut on keyboards that expect it.
Escape Close export tool modals Handy if a modal is covering the editor while you are testing settings.

Troubleshooting

Audio does not load.

Try a standard MP3 or WAV first. Some browser builds cannot decode every AAC, M4A, or unusual WAV variant. If the file came from a DAW, export a fresh 44.1kHz or 48kHz WAV/MP3 and try again.

Export fails in Safari.

Safari has different media encoder support from Chrome and Edge. Use 720p/30fps for a test, avoid long 4K exports, or switch to Chrome/Edge desktop when you need the quality-first MP4 route.

The visualizer looks slow or flickery.

Lower preview quality, disable heavy glow or blur, close other tabs, remove video backgrounds while editing, and use 30fps. Chromebook and mobile browsers can throttle canvas animation under sustained load.

A watermark appears on free 1080p.

That is expected after the free watermark-free HD allowance. 720p stays free, while watermark-free HD/4K and release-week tools need an active pass.

A preset will not save.

Presets use browser storage. Private browsing, aggressive cleanup tools, third-party storage blockers, or clearing site data can remove them. Save important project files separately when possible.

The browser runs out of memory.

Reduce resolution, shorten the export, remove large uploaded video backgrounds, avoid 60fps, and restart the browser before a long render. 4K full-track exports are desktop jobs, not something every laptop or phone can finish.

Ready to make your release visual?

No account to try, no installs, no server audio uploads. If you buy the pass, checkout uses your email to send the key.

Start Free Interactive Tutorial View pricing
Share this guide: