diff --git a/beetsplug/web/static/beets.js b/beetsplug/web/static/beets.js
index 97af70110..eace4d27d 100644
--- a/beetsplug/web/static/beets.js
+++ b/beetsplug/web/static/beets.js
@@ -266,7 +266,9 @@ var AppView = Backbone.View.extend({
     playItem: function(item) {
         var url = 'item/' + item.get('id') + '/file';
         $('#player audio').attr('src', url);
-        $('#player audio').get(0).play();
+        $('#player audio').get(0).play().then(() => {
+            this.updateMediaSession(item);
+        });
 
         if (this.playingItem != null) {
             this.playingItem.entryView.setPlaying(false);
@@ -275,6 +277,26 @@ var AppView = Backbone.View.extend({
         this.playingItem = item;
     },
 
+    updateMediaSession: function (item) {
+      if ("mediaSession" in navigator) {
+        const album_id = item.get("album_id");
+        const album_art_url = "album/" + album_id + "/art";
+        navigator.mediaSession.metadata = new MediaMetadata({
+          title: item.get("title"),
+          artist: item.get("artist"),
+          album: item.get("album"),
+          artwork: [
+            { src: album_art_url, sizes: "96x96" },
+            { src: album_art_url, sizes: "128x128" },
+            { src: album_art_url, sizes: "192x192" },
+            { src: album_art_url, sizes: "256x256" },
+            { src: album_art_url, sizes: "384x384" },
+            { src: album_art_url, sizes: "512x512" },
+          ],
+        });
+      }
+    },
+
     audioPause: function() {
         this.playingItem.entryView.setPlaying(false);
     },
diff --git a/docs/changelog.rst b/docs/changelog.rst
index 0f84f2473..31da975e2 100644
--- a/docs/changelog.rst
+++ b/docs/changelog.rst
@@ -8,6 +8,9 @@ Unreleased
 
 New features:
 
+* :doc:`plugins/web`: Show notifications when a track plays. This uses the
+  Media Session API to customize media notifications.
+
 Bug fixes:
 
 For packagers: