diff --git a/scss/_buttons.scss b/scss/_buttons.scss
index 41b7068224f92f1de103a1f2b104b1401cddcf0f..da6d87916dd8eeee33f51a40671ac1076c186f07 100644
--- a/scss/_buttons.scss
+++ b/scss/_buttons.scss
@@ -68,11 +68,7 @@ fieldset:disabled a.btn {
 
 @each $color, $value in $theme-colors {
   .btn-outline-#{$color} {
-    @if $color == "light" {
-      @include button-outline-variant($value, $gray-900);
-    } @else {
-      @include button-outline-variant($value, $white);
-    }
+    @include button-outline-variant($value);
   }
 }
 
diff --git a/scss/mixins/_buttons.scss b/scss/mixins/_buttons.scss
index 1cbe671221d9aedffe397a85c6afa95e51b6c3f2..06ad6772fa4bddb4c46df06a026c4ca493ce01a8 100644
--- a/scss/mixins/_buttons.scss
+++ b/scss/mixins/_buttons.scss
@@ -54,14 +54,14 @@
   }
 }
 
-@mixin button-outline-variant($color, $color-hover: #fff, $active-background: $color, $active-border: $color) {
+@mixin button-outline-variant($color, $color-hover: color-yiq($color), $active-background: $color, $active-border: $color) {
   color: $color;
   background-color: transparent;
   background-image: none;
   border-color: $color;
 
   &:hover {
-    color: color-yiq($color);
+    color: $color-hover;
     background-color: $active-background;
     border-color: $active-border;
   }