diff --git a/scss/_variables.scss b/scss/_variables.scss
index 2a37d35cb..47a0b8ffe 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -49,7 +49,7 @@ $black: #000000 !default;
 $white: #ffffff !default;
 
 $primary: $blue !default;
-$secondary: $gray-600 !default;
+$secondary: $white !default;
 $success: $green !default;
 $info: $azure !default;
 $warning: $yellow !default;
diff --git a/scss/ui/_buttons.scss b/scss/ui/_buttons.scss
index e72185d92..77673c7c2 100644
--- a/scss/ui/_buttons.scss
+++ b/scss/ui/_buttons.scss
@@ -1,6 +1,17 @@
+.btn-secondary {
+  @include button-variant($secondary, $border-color, $body-color);
+}
+
 .btn {
-  &:not([class^="btn-outline"]):not([class*=" btn-outline"]):not([class^="btn-ghost"]):not([class*=" btn-ghost"]):not(.btn-secondary) {
-    text-shadow: 1px 1px 0 rgba(0, 0, 0, .05);
+  &:not([class^="btn-outline"]):not([class*=" btn-outline"]):not([class^="btn-ghost"]):not([class*=" btn-ghost"]) {
+
+    &:not(.btn-secondary) {
+      text-shadow: 1px 1px 0 rgba(0, 0, 0, .02);
+    }
+
+    &:not(.btn-light):not(.btn-link) {
+      background-image: linear-gradient(-180deg, rgba(0, 0, 0, 0), rgba($dark, .04) 90%);
+    }
 
     &:not(:focus):not(.focus) {
       box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .05), inset 0 2px 0 -1px rgba(255, 255, 255, .1);
@@ -65,11 +76,6 @@
   box-shadow: none !important;
 }
 
-.btn-secondary {
-  @include button-variant(#fff, $border-color, $body-color);
-  background-image: linear-gradient(-180deg, transparent, $gray-100 90%);
-}
-
 .btn-square {
   border-radius: 0;
 }