How do I use the JSON sprite map with Howler.js?

Load the WAV file and pass the sprite object from the JSON to Howler. Each key maps to [startMs, durationMs]. For example: new Howl({ src: ['sprite.wav'], sprite: spriteMap.sprite });

Audio Sprite Generator

Q: What is an audio sprite?

An audio sprite is a single audio file containing multiple sound effects concatenated together, plus a JSON file with start time and duration for each clip. This reduces HTTP requests and eliminates audio loading delays in games and web apps.

Q: Are my audio files uploaded to a server?

No. All processing happens entirely in your browser using the Web Audio API. Your files never leave your device.

Q: What audio formats does the tool accept?

Any format your browser supports — typically MP3, WAV, OGG, AAC, FLAC, and M4A. The output is always a 16-bit PCM WAV file for maximum compatibility.

Add Audio Files

MP3, WAV, OGG, AAC, FLAC supported

🎵

Drag & drop audio files here

or click to browse — no file size limit

Processing audio…

Loading files…

Audio Sprite Ready!

0Files

0sDuration

0KBWAV Size

🎵 Download WAV 📄 Download JSON

📦 Download Complete Package (ZIP)

JSON Sprite Map

Howler.js usage example

// Loading…

How it works

Upload files — any audio format your browser supports.

Set output name and gap between sounds (default 100ms).

Click Generate — the Web Audio API decodes, concatenates, and encodes everything in-browser.

Download the ZIP — contains your .wav sprite and .json timing map.

Output Format

The sprite is exported as 16-bit PCM WAV — the universal lossless format supported by all game engines and audio libraries.

The JSON map uses milliseconds for maximum compatibility with Howler.js, PixiJS Sound, Phaser, and Babylon.js.

Frequently Asked Questions

What is an audio sprite?

An audio sprite is a single audio file that contains multiple sound effects or audio clips concatenated together, paired with a JSON file that records the start time and duration of each clip. This allows a game or web app to load one file instead of many, reducing HTTP requests and eliminating loading delays. Libraries like Howler.js, PixiJS Sound, and Phaser all support audio sprites natively.

Are my files sent to a server?

No — everything runs entirely in your browser using the Web Audio API. Your audio files are decoded, concatenated, and encoded locally. Nothing is ever uploaded or transmitted to any server.

What formats can I upload?

Any audio format your browser can decode — typically MP3, WAV, OGG, AAC, FLAC, and M4A. The output is always a 16-bit PCM WAV file, which is universally compatible with all game engines and audio libraries.

How do I use the JSON map with Howler.js?

Load the WAV file and pass the sprite object from the JSON to Howler. Each key maps to [startMs, durationMs]. The tool generates a ready-to-use code snippet in the result panel after generation.

Audio SpriteGenerator

How it works

Frequently Asked Questions

Related Tools

Audio Sprite
Generator