Animated Cover Art Player

No file selected

How this works and how to do it:

This example shows how to embed an animated WebP image as the cover art inside an MP3’s ID3 tags, so it can be displayed and animated in compatible players like (soon) HTMLPlayer.

  1. Obtain your MP3 audio file (for example, Monody.mp3 by TheFatRat).
  2. Prepare your animated WebP cover art file (cover.webp).
  3. Use a tag editor that supports embedding WebP images (I recommend using, Banger.Show's Online ID3 Tag Editor):
    • Open the MP3 in the tag editor.
    • Replace the cover art with your animated WebP file.
    • Save the file with the updated tags.
  4. (Optional) To verify, use ffmpeg to extract the cover:
    ffmpeg -i yourfile.mp3 -an -vcodec copy cover.webp

Once embedded, upload your MP3 to the player above, and if your browser supports animated WebP, the cover art will display and animate synced with playback.