diff --git a/frontend/app/block/block.less b/frontend/app/block/block.less
index 8fa0af30e..cb8535966 100644
--- a/frontend/app/block/block.less
+++ b/frontend/app/block/block.less
@@ -288,10 +288,10 @@
             justify-content: flex-start;
             flex-direction: column;
             overflow: hidden;
-            background: rgba(230, 186, 30, 0.2);
+            background: var(--conn-status-overlay-bg-color);
             backdrop-filter: blur(50px);
             border-radius: 6px;
-            box-shadow: 0px 13px 16px 0px rgba(0, 0, 0, 0.4);
+            box-shadow: 0px 13px 16px 0px rgb(from var(--block-bg-color) r g b / 40%);
 
             .connstatus-content {
                 display: flex;
@@ -415,7 +415,7 @@
             &.block-no-highlight,
             &.block-preview {
                 .block-mask {
-                    border: 2px solid rgba(255, 255, 255, 0.1) !important;
+                    border: 2px solid rgb(from var(--border-color) r g b / 10%) !important;
                 }
             }
         }
diff --git a/frontend/app/theme.less b/frontend/app/theme.less
index 724cde6d8..7a8211470 100644
--- a/frontend/app/theme.less
+++ b/frontend/app/theme.less
@@ -109,6 +109,7 @@
     --conn-icon-color-6: #ffa24e;
     --conn-icon-color-7: #dbde52;
     --conn-icon-color-8: #58c142;
+    --conn-status-overlay-bg-color: rgba(230, 186, 30, 0.2);
 
     --sysinfo-cpu-color: #58c142;
     --sysinfo-mem-color: #53b4ea;