diff --git a/dist/css/style.css b/dist/css/style.css
index aecddcdd..96dfbe3f 100644
--- a/dist/css/style.css
+++ b/dist/css/style.css
@@ -263,13 +263,22 @@ input:hover,input:active {
 }
 
 #headless-notification {
-    display: none;
+    display: grid;
+    place-content: center;
     position: fixed;
-    color: white;
+	top: 1rem;
+    width: 100%;
     font-size: 200px;
-    left: 0;
-    top: 0;
-    padding-left: 10px;
+    animation: blink infinite alternate 0.5s;
+	transition: visibility 0.5s, opacity 0.5s;
+}
+#headless-notification.hide {
+	opacity: 0;
+    visibility: collapse;
+}
+@keyframes blink {
+    from { color: hsl(0, 0%, 80%); }
+    to { color: hsl(0, 0%, 40%); }
 }
 
 #minimize {
diff --git a/dist/index.html b/dist/index.html
index e4465e62..9e69e53b 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -285,7 +285,7 @@ <h2>Statistics</h2>
 			<button class="headless" title="Toggle rendering. Hotkey: H"><i class="fa fa-eye-slash"></i></button>
 			<button class='pause-button' title="Play/Pause. Hotkey: Spacebar"><i class="fa fa-pause"></i></button>
 		</div>
-		<div id="headless-notification">
+		<div id="headless-notification" class="hide">
 			<i class="fa fa-eye-slash" ></i>
 		</div>
 		<div id='maximize-hot-control' class='hot-controls'>
diff --git a/src/Controllers/ControlPanel.js b/src/Controllers/ControlPanel.js
index ca87c2bd..69d3113a 100644
--- a/src/Controllers/ControlPanel.js
+++ b/src/Controllers/ControlPanel.js
@@ -20,8 +20,6 @@ class ControlPanel {
         this.env_controller.setControlPanel(this);
         this.editor_controller.setControlPanel(this);
         this.stats_panel = new StatsPanel(this.engine.env);
-        this.headless_opacity = 1;
-        this.opacity_change_rate = -0.8;
         this.paused=false;
         this.setHyperparamDefaults();
     }
@@ -132,15 +130,10 @@ class ControlPanel {
         }.bind(this));
 
         $('.headless').click(function() {
-            $('.headless').find("i").toggleClass("fa fa-eye");
-            $('.headless').find("i").toggleClass("fa fa-eye-slash");
-            if (WorldConfig.headless){
-                $('#headless-notification').css('display', 'none');
-                this.engine.env.renderFull();
-            }
-            else {
-                $('#headless-notification').css('display', 'block');
-            }
+            $('.headless').find("i").toggleClass("fa-eye fa-eye-slash");
+            $('#headless-notification').toggleClass('hide');
+            if (WorldConfig.headless) this.engine.env.renderFull();
+            
             WorldConfig.headless = !WorldConfig.headless;
         }.bind(this));
     }
@@ -477,30 +470,10 @@ class ControlPanel {
         this.fps = this.engine.fps;
     }
 
-    updateHeadlessIcon(delta_time) {
-        if (!this.engine.running)
-            return;
-        const min_opacity = 0.4;
-        var op = this.headless_opacity + (this.opacity_change_rate*delta_time/1000);
-        if (op <= min_opacity){
-            op=min_opacity;
-            this.opacity_change_rate = -this.opacity_change_rate;
-        }
-        else if (op >= 1){
-            op=1;
-            this.opacity_change_rate = -this.opacity_change_rate;
-        }
-        this.headless_opacity = op;
-        $('#headless-notification').css('opacity',(op*100)+'%');
-    }
-
-    update(delta_time) {
+    update() {
         $('#fps-actual').text("Actual FPS: " + Math.floor(this.engine.actual_fps));
         $('#reset-count').text("Auto reset count: " + this.engine.env.reset_count);
         this.stats_panel.updateDetails();
-        if (WorldConfig.headless)
-            this.updateHeadlessIcon(delta_time);
-
     }
 
 }