diff --git a/site/theme/static/dark.less b/site/theme/static/dark.less
index 97b2f2dbf5..bb2c5a61df 100644
--- a/site/theme/static/dark.less
+++ b/site/theme/static/dark.less
@@ -11,7 +11,7 @@
 
   .toc-affix {
     .ant-affix {
-      background: #141414;
+      background: @component-background;
     }
   }
 
@@ -22,7 +22,7 @@
   }
 
   .code-box {
-    border: 1px solid #303030;
+    border: 1px solid @border-color-split;
     .code-box-title {
       &,
       a {
@@ -49,7 +49,7 @@
     }
 
     &-demo {
-      border-bottom: 1px solid #303030;
+      border-bottom: 1px solid @border-color-split;
     }
 
     &-codepen {
@@ -227,7 +227,7 @@
   }
 
   .browser-mockup.with-url::after {
-    background-color: #141414;
+    background-color: @component-background;
   }
 
   .browser-mockup {
@@ -240,27 +240,27 @@
   }
 
   .browser-mockup.with-tab::after {
-    border-bottom: 2em solid #141414;
+    border-bottom: 2em solid @component-background;
   }
 
-  .ds-dropdown-menu {
-    [class^='ds-dataset-'] {
-      background: #1f1f1f;
-      .algolia-docsearch-suggestion {
-        background: #1f1f1f;
+  .algolia-autocomplete {
+    .ds-dropdown-menu {
+      [class^='ds-dataset-'] {
+        background: @popover-background;
+        .algolia-docsearch-suggestion {
+          background: @popover-background;
+        }
       }
     }
-  }
-  .algolia-autocomplete {
     .algolia-docsearch-suggestion--category-header {
       color: rgba(255, 255, 255, 0.65);
-      border-bottom: 1px solid #303030;
+      border-bottom: 1px solid @border-color-split;
     }
     .algolia-docsearch-suggestion--subcategory-column::before {
-      background: #303030;
+      background: @border-color-split;
     }
     .algolia-docsearch-suggestion--content::before {
-      background: #303030;
+      background: @border-color-split;
     }
   }
 
@@ -300,7 +300,7 @@
   .token.symbol,
   .token.bullet,
   .token.addition {
-    color: #177ddc;
+    color: @primary-color;
   }
 
   .token.title,