By · Updated

Audio to Base64

Base64 Audio Data URI for Embedding Short Clips in HTML, JavaScript or CSS

No ratings yet

OneTask is free, with no sign-up, and built by one person.
If this tool saved you time, a coffee helps keep new ones coming.

How the Audio To Base64 works

Convert audio to base64 without uploading it. Turn a short sound — a click, a notification, a sample — into a base64 data URI that can be embedded directly in a page, a script, a stylesheet or a JSON payload with no separate file to host. Trim the clip and choose MP3 or WAV first so that the text stays small. The encoding happens in your browser.

How audio to base64 encoding works

A data URI stores a file inside a string: data:audio/mpeg;base64, followed by the file's bytes encoded as text. Browsers treat it exactly like a URL, so an <audio> element, a JavaScript Audio object or a fetch call can load it without a network request. That makes it handy for single-file demos, browser extensions, email-safe widgets, offline apps and anywhere a second HTTP request is unwelcome or impossible.

Keep it small. Base64 makes the data a third larger than the binary, and every kilobyte of it sits inline in your source. A one-second click at 128 kbps MP3 is about 16 KB of binary and 21 KB of text — fine. A three-minute song is several megabytes of text that bloats the page, slows parsing and defeats caching. The stats panel estimates the encoded size for the current clip and format and advises when it is over 200 KB, which is a sensible ceiling for inlining.

Trim first. Drag the range handles on the waveform to select just the sound you need; the export encodes only that part. Leading silence in particular is wasted bytes and a delayed sound effect.

Format. The export selector chooses between MP3 at 128, 192 or 320 kbps and 16-bit WAV. MP3 is far smaller and plays in every browser. WAV is worth it only for very short sounds where an MP3 encoder's start-up padding — a few tens of milliseconds of silence — would spoil the timing, such as a tightly synchronised click or a game sound that must start instantly.

Wrappers. The output can be the bare URI, or it can be wrapped ready to paste: an <audio controls> element, a JavaScript snippet that creates an Audio object and plays it, or a CSS url() value for the rare stylesheet that references sound. The result is saved as a text file whose extension matches the wrapper.

Using the JavaScript output. Browsers block sound until the user has interacted with the page, so call .play() from a click or key handler. Create the Audio object once and reuse it; decoding a data URI repeatedly is slower than decoding a cached file.

Getting it back. Any base64 decoder can turn the text back into a file, including the base64 decoder on this site: strip the data:…;base64, prefix and decode the remainder.

FAQ

Why is the base64 text bigger than the audio file?

Base64 represents three bytes of binary with four characters of text, so the output is always about 33 percent larger than the encoded file. That overhead is why data URIs should be reserved for small sounds.

How long a clip is reasonable to inline?

A few seconds. Under 200 KB of text is a good limit, which is around twelve seconds at 128 kbps MP3. Anything longer should be a separate file that the browser can cache and stream.

Does the sound play on iPhones?

Yes, as long as playback is started by a user action such as a tap. iOS refuses autoplay regardless of whether the source is a data URI or a file, so wire play() to a button.

Can I embed the result in JSON or a config file?

Yes. The URI is plain ASCII with no quotes or newlines, so it can be a JSON string value or sit in YAML or an environment variable. Remember that some systems cap string length; check before inlining anything large.

See also: all Audio & Video tools, Units, Images, Documents, Data & Code.

Related tools