diff --git a/web_src/css/base.css b/web_src/css/base.css
index bcf7b0811b81..36624ab95762 100644
--- a/web_src/css/base.css
+++ b/web_src/css/base.css
@@ -180,10 +180,13 @@
   --color-caret: var(--color-text-dark);
   --color-reaction-bg: #0000000a;
   --color-reaction-active-bg: var(--color-primary-alpha-20);
-  --color-tooltip-bg: #000000f0;
   --color-tooltip-text: #ffffff;
+  --color-tooltip-bg: #000000f0;
   --color-header-bar: #ffffff;
-  --color-label-active-bg: #d0d0d0;
+  --color-label-text: #232323;
+  --color-label-bg: #cacaca5b;
+  --color-label-hover-bg: #cacacaa0;
+  --color-label-active-bg: #cacacaff;
   --color-accent: var(--color-primary-light-1);
   --color-small-accent: var(--color-primary-light-6);
   --color-active-line: #fffbdd;
@@ -820,16 +823,6 @@ a.label,
   margin-right: 0.35em;
 }
 
-.ui.menu .item > .label {
-  background: var(--color-grey);
-}
-
-.ui.active.label {
-  background: var(--color-label-active-bg);
-  border-color: var(--color-label-active-bg);
-  color: var(--color-text-dark);
-}
-
 .ui.menu .dropdown.item:hover,
 .ui.menu a.item:hover {
   color: var(--color-text);
@@ -1976,22 +1969,32 @@ i.icon.centerlock {
 
 .ui.label {
   padding: 0.3em 0.5em;
-  background: var(--color-light);
-  color: var(--color-text-light);
+}
+
+.ui.label,
+.ui.menu .item > .label {
+  background: var(--color-label-bg);
+  color: var(--color-label-text);
+}
+
+.ui.active.label {
+  background: var(--color-label-active-bg);
+  border-color: var(--color-label-active-bg);
+  color: var(--color-label-text);
 }
 
 .ui.labels a.label:hover,
 a.ui.label:hover {
-  background: var(--color-hover);
-  border-color: var(--color-hover);
-  color: var(--color-text);
+  background: var(--color-label-hover-bg);
+  border-color: var(--color-label-hover-bg);
+  color: var(--color-label-text);
 }
 
 .ui.labels a.active.label:hover,
 a.ui.active.label:hover {
-  background: var(--color-active);
-  border-color: var(--color-active);
-  color: var(--color-text);
+  background: var(--color-label-active-bg);
+  border-color: var(--color-label-active-bg);
+  color: var(--color-label-text);
 }
 
 .ui.label > .detail .icons {
diff --git a/web_src/css/themes/theme-arc-green.css b/web_src/css/themes/theme-arc-green.css
index 84007d2e2dfe..d5db18b55ae5 100644
--- a/web_src/css/themes/theme-arc-green.css
+++ b/web_src/css/themes/theme-arc-green.css
@@ -165,8 +165,13 @@
   --color-caret: var(--color-text); /* should ideally be --color-text-dark, see #15651 */
   --color-reaction-bg: #ffffff12;
   --color-reaction-active-bg: var(--color-primary-alpha-40);
+  --color-tooltip-text: #ffffff;
+  --color-tooltip-bg: #000000f0;
   --color-header-bar: #2e323e;
-  --color-label-active-bg: #4c525e;
+  --color-label-text: #dfe3ec;
+  --color-label-bg: #7c84974b;
+  --color-label-hover-bg: #7c8497a0;
+  --color-label-active-bg: #7c8497ff;
   --color-accent: var(--color-primary-light-1);
   --color-small-accent: var(--color-primary-light-5);
   --color-active-line: #534d1b;