diff --git a/src/js/game/hud/parts/vignette_overlay.js b/src/js/game/hud/parts/vignette_overlay.js
index dc0e5db7..52c3b078 100644
--- a/src/js/game/hud/parts/vignette_overlay.js
+++ b/src/js/game/hud/parts/vignette_overlay.js
@@ -1,10 +1,23 @@
 import { BaseHUDPart } from "../base_hud_part";
 import { makeDiv } from "../../../core/utils";
+import { DynamicDomAttach } from "../dynamic_dom_attach";
+import { KEYMAPPINGS } from "../../key_action_mapper";
 
 export class HUDVignetteOverlay extends BaseHUDPart {
     createElements(parent) {
         this.element = makeDiv(parent, "ingame_VignetteOverlay");
     }
 
-    initialize() {}
+    initialize() {
+        this.visible = true;
+        this.domAttach = new DynamicDomAttach(this.root, this.element);
+        this.domAttach.update(this.visible);
+
+        this.root.keyMapper.getBinding(KEYMAPPINGS.ingame.toggleVignette).add(() => this.toggle());
+    }
+
+    toggle() {
+        this.visible = !this.visible;
+        this.domAttach.update(this.visible);
+    }
 }
diff --git a/src/js/game/key_action_mapper.js b/src/js/game/key_action_mapper.js
index a4d53156..c4a01b4c 100644
--- a/src/js/game/key_action_mapper.js
+++ b/src/js/game/key_action_mapper.js
@@ -26,6 +26,7 @@ export const KEYMAPPINGS = {
         toggleHud: { keyCode: 113 }, // F2
         exportScreenshot: { keyCode: 114 }, // F3
         toggleFPSInfo: { keyCode: 115 }, // F4
+        toggleVignette: { keyCode: 116 }, // F5
     },
 
     navigation: {
diff --git a/translations/base-en.yaml b/translations/base-en.yaml
index 1b0314ed..fb43c6f6 100644
--- a/translations/base-en.yaml
+++ b/translations/base-en.yaml
@@ -704,6 +704,7 @@ keybindings:
         toggleHud: Toggle HUD
         toggleFPSInfo: Toggle FPS and Debug Info
         exportScreenshot: Export whole Base as Image
+        toggleVignette: Toggle Vignette Effect
         belt: *belt
         splitter: *splitter
         underground_belt: *underground_belt