diff --git a/ionic/components/button/button.ios.scss b/ionic/components/button/button.ios.scss
index b0d17e7bb6..b5cad1f3e4 100644
--- a/ionic/components/button/button.ios.scss
+++ b/ionic/components/button/button.ios.scss
@@ -157,7 +157,7 @@ $button-ios-small-icon-font-size:     1.3em !default;
 
 .button-clear {
   border-color: transparent;
-  color: color-shade($button-ios-color);
+  color: $button-ios-color;
   background-color: transparent;
 
   &.activated {
@@ -167,7 +167,7 @@ $button-ios-small-icon-font-size:     1.3em !default;
 
   &:hover:not(.disable-hover) {
     opacity: 0.6;
-    color: color-shade($button-ios-color);
+    color: $button-ios-color;
   }
 }
 
@@ -178,7 +178,7 @@ $button-ios-small-icon-font-size:     1.3em !default;
 @mixin ios-button-clear($color-name, $color-value) {
 
   .button-clear-#{$color-name} {
-    $fg-color: color-shade($color-value);
+    $fg-color: $color-value;
     border-color: transparent;
     background-color: transparent;
     color: $fg-color;
@@ -188,7 +188,7 @@ $button-ios-small-icon-font-size:     1.3em !default;
     }
 
     &:hover:not(.disable-hover) {
-      color: color-shade($fg-color);
+      color: $fg-color;
     }
   }
 
diff --git a/ionic/components/button/button.md.scss b/ionic/components/button/button.md.scss
index 63b09d44a6..ac5fe0ef34 100644
--- a/ionic/components/button/button.md.scss
+++ b/ionic/components/button/button.md.scss
@@ -186,7 +186,7 @@ $button-md-small-icon-font-size:           1.4em !default;
   opacity: 1;
   box-shadow: none;
   background-color: transparent;
-  color: color-shade($button-md-color);
+  color: $button-md-color;
 
   &.activated {
     background-color: $button-md-clear-active-background-color;
@@ -194,7 +194,8 @@ $button-md-small-icon-font-size:           1.4em !default;
   }
 
   &:hover:not(.disable-hover) {
-    color: color-shade($button-md-color);
+
+    color: $button-md-color;
   }
 }
 
@@ -205,7 +206,7 @@ $button-md-small-icon-font-size:           1.4em !default;
 @mixin md-button-clear($color-name, $color-value) {
 
   .button-clear-#{$color-name} {
-    $fg-color: color-shade($color-value);
+    $fg-color: $color-value;
     border-color: transparent;
     background-color: transparent;
     color: $fg-color;
@@ -217,7 +218,7 @@ $button-md-small-icon-font-size:           1.4em !default;
     }
 
     &:hover:not(.disable-hover) {
-      color: color-shade($fg-color);
+      color: $fg-color;
     }
   }
 }