diff --git a/scss/_spinners.scss b/scss/_spinners.scss
index 7d8fba7a11b8..98c0108e3955 100644
--- a/scss/_spinners.scss
+++ b/scss/_spinners.scss
@@ -10,7 +10,7 @@
   display: inline-block;
   width: $spinner-width;
   height: $spinner-height;
-  vertical-align: text-bottom;
+  vertical-align: $spinner-vertical-align;
   border: $spinner-border-width solid currentColor;
   border-right-color: transparent;
   // stylelint-disable-next-line property-disallowed-list
@@ -42,7 +42,7 @@
   display: inline-block;
   width: $spinner-width;
   height: $spinner-height;
-  vertical-align: text-bottom;
+  vertical-align: $spinner-vertical-align;
   background-color: currentColor;
   // stylelint-disable-next-line property-disallowed-list
   border-radius: 50%;
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 5af2630cb2a5..705b5212151b 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -1101,9 +1101,10 @@ $carousel-transition:                transform $carousel-transition-duration eas
 
 // Spinners
 
-$spinner-width:         2rem !default;
-$spinner-height:        $spinner-width !default;
-$spinner-border-width:  .25em !default;
+$spinner-width:           2rem !default;
+$spinner-height:          $spinner-width !default;
+$spinner-vertical-align:  -.125em !default;
+$spinner-border-width:    .25em !default;
 
 $spinner-width-sm:        1rem !default;
 $spinner-height-sm:       $spinner-width-sm !default;