diff --git a/core/themes/claro/css/components/button.css b/core/themes/claro/css/components/button.css
index e256d271ffc0950680023d3cd143100a6d41db88..8594ae4390c9f72833c71d5c91307d55e3763f96 100644
--- a/core/themes/claro/css/components/button.css
+++ b/core/themes/claro/css/components/button.css
@@ -162,6 +162,11 @@
   padding-left: 0.25em;
 }
 
+a.button:hover,
+a.button:active {
+  color: #222330;
+}
+
 /* Primary button styles */
 
 .button--primary {
@@ -178,6 +183,11 @@
   background-color: #00339a;
 }
 
+a.button--primary:hover,
+a.button--primary:active {
+  color: #fff;
+}
+
 /* Danger button styles */
 
 .button--danger {
@@ -194,6 +204,11 @@
   background-color: #ab1b1b;
 }
 
+a.button--danger:hover,
+a.button--danger:active {
+  color: #fff;
+}
+
 /**
  * Disabled state styles as last.
  *
diff --git a/core/themes/claro/css/components/button.pcss.css b/core/themes/claro/css/components/button.pcss.css
index 307b5233d645b65bc40d94d8aa9b81fc57328a54..f1f95222bd2d83c1980cbfe8f309d61fc0315221 100644
--- a/core/themes/claro/css/components/button.pcss.css
+++ b/core/themes/claro/css/components/button.pcss.css
@@ -104,6 +104,11 @@
   padding-left: 0.25em;
 }
 
+a.button:hover,
+a.button:active {
+  color: var(--button-fg-color);
+}
+
 /* Primary button styles */
 .button--primary {
   color: var(--button-fg-color--primary);
@@ -119,6 +124,11 @@
   background-color: var(--button--active-bg-color--primary);
 }
 
+a.button--primary:hover,
+a.button--primary:active {
+  color: var(--button-fg-color--primary);
+}
+
 /* Danger button styles */
 .button--danger {
   color: var(--button-fg-color--danger);
@@ -132,6 +142,11 @@
   background-color: var(--button--active-bg-color--danger);
 }
 
+a.button--danger:hover,
+a.button--danger:active {
+  color: var(--button-fg-color--danger);
+}
+
 /**
  * Disabled state styles as last.
  *