diff --git a/packages/theme/styles/_colors.scss b/packages/theme/styles/_colors.scss
index 40d2dc54be..6d5c260975 100644
--- a/packages/theme/styles/_colors.scss
+++ b/packages/theme/styles/_colors.scss
@@ -25,6 +25,7 @@
   --primary-button-hovered: #3575DE;
   --primary-button-pressed: #1C52AB;
   --primary-button-focused: #205DC2;
+  --secondary-button-color: rgba(0, 0, 0, .8);
   --secondary-button-default: #D3E1F8;
   --secondary-button-hovered: #BDD2F5;
   --secondary-button-pressed: #A7C3F1;
diff --git a/packages/theme/styles/button.scss b/packages/theme/styles/button.scss
index 4159e78912..0a00cb20fd 100644
--- a/packages/theme/styles/button.scss
+++ b/packages/theme/styles/button.scss
@@ -241,6 +241,7 @@
     }
   }
   &.secondary {
+    color: var(--secondary-button-color);
     background-color: var(--secondary-button-default);
     &:hover { background-color: var(--secondary-button-hovered); }
     &:active,
diff --git a/packages/ui/src/components/CircleButton.svelte b/packages/ui/src/components/CircleButton.svelte
index a53e382259..767e310706 100644
--- a/packages/ui/src/components/CircleButton.svelte
+++ b/packages/ui/src/components/CircleButton.svelte
@@ -110,6 +110,7 @@
       }
     }
     &.primary {
+      color: var(--secondary-button-color);
       background-color: var(--secondary-button-default);
       &:hover {
         background-color: var(--secondary-button-hovered);