diff --git a/src/scss/cdb-components/_buttons.scss b/src/scss/cdb-components/_buttons.scss
index b296f0c..e48b21b 100644
--- a/src/scss/cdb-components/_buttons.scss
+++ b/src/scss/cdb-components/_buttons.scss
@@ -239,7 +239,7 @@ Layout Component:
 
   &:hover,
   &:active {
-    background: darken($cBlue, 8%);
+    background: $cBlueHover;
   }
 
   &.is-loading {
@@ -404,7 +404,7 @@ Layout Component:
 
   &:hover {
     background: rgba($cBlue, 0.08);
-    box-shadow: inset 0 0 0 2px darken($cBlue, 8%);
+    box-shadow: inset 0 0 0 2px $cBlueHover;
   }
 
   &:active {
diff --git a/src/scss/cdb-components/_menu.scss b/src/scss/cdb-components/_menu.scss
index 5f4a949..bbfcd66 100644
--- a/src/scss/cdb-components/_menu.scss
+++ b/src/scss/cdb-components/_menu.scss
@@ -158,7 +158,7 @@
   color: $cBlue;
 
   &:hover {
-    border-bottom: 2px solid darken($cBlue, 8%);
+    border-bottom: 2px solid $cBlueHover;
   }
 }
 
@@ -206,7 +206,7 @@
   color: $cBlue;
 
   &:hover {
-    border-bottom: 2px solid darken($cBlue, 8%);
+    border-bottom: 2px solid $cBlueHover;
   }
 }