diff --git a/ui/scss/component/_wunderbar.scss b/ui/scss/component/_wunderbar.scss
index 6f3df429d..55516f0e8 100644
--- a/ui/scss/component/_wunderbar.scss
+++ b/ui/scss/component/_wunderbar.scss
@@ -53,7 +53,7 @@
   padding-right: var(--spacing-small);
   padding-left: 2.5rem;
   transition: all 0.2s;
-  background-color: #677e87;
+  background-color: var(--color-wunderbar);
   color: white;
 
   &::placeholder {
diff --git a/ui/scss/themes/dark.scss b/ui/scss/themes/dark.scss
index a6373889d..cd20beb50 100644
--- a/ui/scss/themes/dark.scss
+++ b/ui/scss/themes/dark.scss
@@ -72,6 +72,7 @@
   --color-placeholder-background: #4e5862;
   --color-spinner-light: #5a6570;
   --color-spinner-dark: #212529;
+  --color-wunderbar: #89939e;
 
   // Tags
   --color-tag: var(--color-primary);
diff --git a/ui/scss/themes/light.scss b/ui/scss/themes/light.scss
index 862b6a703..01923f82d 100644
--- a/ui/scss/themes/light.scss
+++ b/ui/scss/themes/light.scss
@@ -46,6 +46,7 @@
   // Search
   --color-search-suggestion: #212529;
   --color-search-suggestion-background: #cce6fb;
+  --color-wunderbar: var(--color-primary);
 
   // Snack
   --color-snack-bg: var(--color-primary);