diff --git a/htdocs/css/openwebrx.css b/htdocs/css/openwebrx.css
index 6fb6e2ed..37b15391 100644
--- a/htdocs/css/openwebrx.css
+++ b/htdocs/css/openwebrx.css
@@ -1344,14 +1344,18 @@ img.openwebrx-mirror-img
     height: 27px;
 }
 
-.openwebrx-record-button svg {
-    height: 27px;
+@keyframes openwebrx-record-animation {
+    0% { background: #ff0000; color: white; }
+   50% { background: #800000; color: white; }
+  100% { background: #ff0000; color: white; }
 }
 
 .openwebrx-record-button {
     color: #ff8080;
     float: right;
     margin-top: 13px;
+    animation-duration: 1s;
+    animation-iteration-count: infinite;
 }
 
 .openwebrx-slider-button svg {
diff --git a/htdocs/openwebrx.js b/htdocs/openwebrx.js
index 825a2a85..c2e86b8b 100644
--- a/htdocs/openwebrx.js
+++ b/htdocs/openwebrx.js
@@ -83,14 +83,11 @@ function toggleRecording() {
 
     if (audioEngine.recording) {
         audioEngine.stopRecording();
-        $recButton.css('background', '');
-        $recButton.css('color', '');
+        $recButton.css('animation-name', '');
     } else {
         audioEngine.startRecording();
-        $recButton.css('background', '#ff0000');
-        $recButton.css('color', '#ffffff');
+        $recButton.css('animation-name', 'openwebrx-record-animation');
     }
-
 }
 
 function zoomInOneStep() {