diff --git a/src/components/button.style.js b/src/components/button.style.js
index 3c09058444..1404061c21 100644
--- a/src/components/button.style.js
+++ b/src/components/button.style.js
@@ -79,14 +79,14 @@ export default {
     {
       state: ['toggled'],
       directives: {
-        background: '--accent,-24.2',
+        background: '--inheritedBackground,-24.2',
         shadow: [buttonOuterShadow, ...inputInsetFakeBorders]
       }
     },
     {
       state: ['toggled', 'hover'],
       directives: {
-        background: '--accent,-24.2',
+        background: '--inheritedBackground,-24.2',
         shadow: [hoverGlow, ...inputInsetFakeBorders]
       }
     },