diff --git a/public/browserDetection.ts b/public/browserDetection.ts
new file mode 100644
index 0000000..1114e7f
--- /dev/null
+++ b/public/browserDetection.ts
@@ -0,0 +1,3 @@
+if (navigator.userAgent.indexOf("Firefox") >= 0) {
+    $('#firefoxisbad').removeClass('display-none')
+}
diff --git a/public/gui.css b/public/gui.css
index 4d12e5c..2a4cab2 100644
--- a/public/gui.css
+++ b/public/gui.css
@@ -195,3 +195,24 @@ body {
 .dropdown-menu {
   min-width: 250px;
 }
+
+#firefoxisbad {
+  position:absolute;
+  text-align: center;
+  vertical-align: middle;
+  background:#000000;
+  color:#ffffff;
+  opacity:0.9;
+  left:0;
+  right:0;
+  top:0;
+  bottom:0;
+  z-index:10
+}
+
+#firefoxisbadInner {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translateX(-50%) translateY(-50%);
+}
diff --git a/public/gui.html b/public/gui.html
index 8968eaf..3ac643f 100644
--- a/public/gui.html
+++ b/public/gui.html
@@ -27,6 +27,10 @@
     <link href="gui.css" rel="stylesheet" type="text/css" />
   </head>
   <body>
+    <!-- https://waveform.prototyping.bbc.co.uk/waveform-data-issue-63/ -->
+    <div id="firefoxisbad" class="display-none">
+      <div id="firefoxisbadInner">Please use Chrome. Firefox has a bug with mp3s in decodeAudioData.</div>
+    </div>
     <div class="toplevel">
       <div style="display: flex; flex-direction: row;">
         <div style="align-self: flex-start;flex: 1;">
diff --git a/tsconfig.json b/tsconfig.json
index a11d938..6ba28de 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -61,6 +61,7 @@
     // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
   },
     "files": [
+        "public/browserDetection.ts",
         "public/types.ts",
         "public/extensions.ts",
         "public/misc.ts",
