diff --git a/scss/_buttons.scss b/scss/_buttons.scss
index cbc0784a4d9c..11fc3bd9ed7e 100644
--- a/scss/_buttons.scss
+++ b/scss/_buttons.scss
@@ -172,14 +172,14 @@
   --#{$prefix}btn-box-shadow: 0 0 0 #000; // Can't use `none` as keyword negates all values when used with multiple shadows
   --#{$prefix}btn-focus-shadow-rgb: #{to-rgb(mix(color-contrast($link-color), $link-color, 15%))};
 
-  text-decoration: $link-decoration;
+  text-decoration: var(--#{$prefix}link-decoration);
   @if $enable-gradients {
     background-image: none;
   }
 
   &:hover,
   &:focus-visible {
-    text-decoration: $link-hover-decoration;
+    text-decoration: var(--#{$prefix}link-hover-decoration);
   }
 
   &:focus-visible {
diff --git a/scss/_reboot.scss b/scss/_reboot.scss
index 18791753d0ca..4472a566a645 100644
--- a/scss/_reboot.scss
+++ b/scss/_reboot.scss
@@ -243,11 +243,11 @@ sup { top: -.5em; }
 
 a {
   color: rgba(var(--#{$prefix}link-color-rgb), var(--#{$prefix}link-opacity, 1));
-  text-decoration: $link-decoration;
+  text-decoration: var(--#{$prefix}link-decoration);
 
   &:hover {
     --#{$prefix}link-color-rgb: var(--#{$prefix}link-hover-color-rgb);
-    text-decoration: $link-hover-decoration;
+    text-decoration: var(--#{$prefix}link-hover-decoration);
   }
 }
 
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 81fbde651881..87cad0e9fca6 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -454,7 +454,7 @@ $link-color:                              $primary !default;
 $link-decoration:                         underline !default;
 $link-shade-percentage:                   20% !default;
 $link-hover-color:                        shift-color($link-color, $link-shade-percentage) !default;
-$link-hover-decoration:                   null !default;
+$link-hover-decoration:                   $link-decoration !default;
 
 $stretched-link-pseudo-element:           after !default;
 $stretched-link-z-index:                  1 !default;