diff --git a/src/components/Qrcode.css b/src/components/Qrcode.css
index 0b2726c..f0871cf 100644
--- a/src/components/Qrcode.css
+++ b/src/components/Qrcode.css
@@ -788,4 +788,5 @@ select:-moz-focusring {
 .medium-zoom-overlay {
     -webkit-backdrop-filter: saturate(180%) blur(10px);
     backdrop-filter: saturate(180%) blur(10px);
+    background: var(--zoom-bg-color)!important;
 }
\ No newline at end of file
diff --git a/src/index.css b/src/index.css
index 365c9a5..d3e86d7 100644
--- a/src/index.css
+++ b/src/index.css
@@ -20,6 +20,7 @@
     --qr-opacity-hover: calc(1);
     --upload-color: rgba(102,102,102,1);
     --b-w: rgba(0,0,0,1);
+    --zoom-bg-color: rgba(255,255,255,0.8);
 }
 
 @media (prefers-color-scheme: dark) {
@@ -38,6 +39,8 @@
         --qr-opacity-hover: calc(0.65);
         --upload-color: rgba(150,150,150,1);
         --b-w: rgba(255,255,255,1);
+        --zoom-bg-color: rgba(0,0,0,0.8);
+
     }
 }