Music Code Generator

Embed a song or sound on your website with HTML5 audio code.

HTML
<audio controls preload="metadata">
  <source src="https://interactive-examples.mdn.mozilla.net/media/cc0-audio/t-rex-roar.mp3" type="audio/mpeg">
  Your browser does not support the audio element.
</audio>

Music Code Generator

Adding background music, a podcast episode or a sound effect to a website no longer requires Flash or a plugin. The HTML5 <audio> element plays MP3, OGG, WAV, AAC and other formats natively in every modern browser. The Music Code Generator builds the complete embed code for you — including <source> elements with the correct MIME type — and shows a working player preview.

How to use it

  1. Paste the URL of your audio file. It must be publicly reachable, e.g. on your own server or a CDN.
  2. Optionally add a second URL in another format; browsers use the first one they can play.
  3. Choose whether to show the player controls, loop the track, start muted or autoplay.
  4. Copy the HTML and paste it where the player should appear.

The MIME type is detected from the file extension (.mp3 → audio/mpeg, .ogg → audio/ogg, .wav → audio/wav, .m4a → audio/mp4), which lets the browser skip formats it cannot decode without downloading them.

Autoplay rules

Chrome, Safari and Firefox block audible autoplay. A sound may start on its own only when it is muted, or after the user has interacted with the site. That is why turning on Autoplay also adds muted. Auto-playing music is also widely considered a poor user experience, so prefer visible controls.

Tips

Compress long tracks to 128–192 kbps MP3 to keep pages fast, and set preload="metadata" so the file is not downloaded until needed. If you need a video player instead, use the HTML Video Generator; to embed YouTube or Spotify players, use the HTML iFrame Generator.

Frequently Asked Questions

Browsers block autoplay with sound until the visitor interacts with the page. Autoplay is only allowed when the audio is muted, so the generator adds muted automatically when you enable autoplay. Let visitors start the music with the controls instead.

MP3 plays in every modern browser and is the safest single choice. Adding an OGG or Opus file as a second source can reduce file size; the browser picks the first format it supports.

No. Streaming services provide their own iframe embed codes. The audio element plays files you host yourself or files on a server that allows hotlinking, such as a CDN or cloud storage link.

preload="metadata" fetches only the duration and basic information, "none" downloads nothing until play is pressed, and "auto" lets the browser download the whole file in advance. metadata is a good default for most pages.