diff --git a/demos/button.scss b/demos/button.scss
index 43eca9d38d3..2ea8db3b321 100644
--- a/demos/button.scss
+++ b/demos/button.scss
@@ -24,11 +24,11 @@
 
 .mdc-button.secondary-text-button {
   @include mdc-button-ink-color($mdc-theme-secondary);
-  @include mdc-ripple-color(secondary, $mdc-unfilled-button-ripple-opacity);
+  @include mdc-states(secondary);
 
   @include mdc-theme-dark(".mdc-button") {
     @include mdc-button-ink-color($mdc-theme-secondary);
-    @include mdc-ripple-color(secondary, $mdc-unfilled-button-ripple-opacity);
+    @include mdc-states(secondary);
   }
 }
 
@@ -43,12 +43,12 @@
 .mdc-button.secondary-stroked-button {
   @include mdc-button-ink-color($mdc-theme-secondary);
   @include mdc-button-stroke-color($mdc-theme-secondary);
-  @include mdc-ripple-color(secondary, $mdc-unfilled-button-ripple-opacity);
+  @include mdc-states(secondary);
 
   @include mdc-theme-dark(".mdc-button") {
     @include mdc-button-ink-color($mdc-theme-secondary);
     @include mdc-button-stroke-color($mdc-theme-secondary);
-    @include mdc-ripple-color(secondary, $mdc-unfilled-button-ripple-opacity);
+    @include mdc-states(secondary);
   }
 }
 
diff --git a/demos/common.scss b/demos/common.scss
index 68b1783a1dc..2a88103e231 100644
--- a/demos/common.scss
+++ b/demos/common.scss
@@ -51,7 +51,7 @@ $dark-button-color: $material-color-light-green-a200;
 .mdc-button {
   @include mdc-theme-dark {
     @include mdc-button-ink-color($dark-button-color);
-    @include mdc-ripple-color($dark-button-color, $mdc-unfilled-button-ripple-opacity);
+    @include mdc-states($dark-button-color);
   }
 }
 
diff --git a/demos/theme/index.scss b/demos/theme/index.scss
index cbbb9c6888a..a71ce98ff14 100644
--- a/demos/theme/index.scss
+++ b/demos/theme/index.scss
@@ -135,11 +135,11 @@ figure {
 
 .mdc-button.secondary-text-button {
   @include mdc-button-ink-color($mdc-theme-secondary);
-  @include mdc-ripple-color($mdc-theme-secondary, $mdc-unfilled-button-ripple-opacity);
+  @include mdc-states($mdc-theme-secondary);
 
   @include mdc-theme-dark(".mdc-button") {
     @include mdc-button-ink-color($mdc-theme-secondary);
-    @include mdc-ripple-color($mdc-theme-secondary, $mdc-unfilled-button-ripple-opacity);
+    @include mdc-states($mdc-theme-secondary);
   }
 }
 
@@ -154,12 +154,12 @@ figure {
 .mdc-button.secondary-stroked-button {
   @include mdc-button-ink-color($mdc-theme-secondary);
   @include mdc-button-stroke-color($mdc-theme-secondary);
-  @include mdc-ripple-color($mdc-theme-secondary, $mdc-unfilled-button-ripple-opacity);
+  @include mdc-states($mdc-theme-secondary);
 
   @include mdc-theme-dark(".mdc-button") {
     @include mdc-button-ink-color($mdc-theme-secondary);
     @include mdc-button-stroke-color($mdc-theme-secondary);
-    @include mdc-ripple-color($mdc-theme-secondary, $mdc-unfilled-button-ripple-opacity);
+    @include mdc-states($mdc-theme-secondary);
   }
 }
 
@@ -400,15 +400,15 @@ figure {
 }
 
 .demo-ripple-surface--primary {
-  @include mdc-ripple-color(primary, $mdc-ripple-pressed-dark-ink-opacity);
+  @include mdc-states(primary);
 }
 
 .demo-ripple-surface--secondary {
-  @include mdc-ripple-color(secondary, $mdc-ripple-pressed-dark-ink-opacity);
+  @include mdc-states(secondary);
 }
 
 .demo-ripple-surface--custom {
-  @include mdc-ripple-color($demo-custom-color, $mdc-ripple-pressed-dark-ink-opacity);
+  @include mdc-states($demo-custom-color);
 }
 
 .mdc-ripple-surface[data-mdc-ripple-is-unbounded] {
diff --git a/packages/mdc-button/_mixins.scss b/packages/mdc-button/_mixins.scss
index 0e9c5112695..77d48225c36 100644
--- a/packages/mdc-button/_mixins.scss
+++ b/packages/mdc-button/_mixins.scss
@@ -28,10 +28,10 @@
 
   @if ($fill-tone == "dark") {
     @include mdc-button-ink-color(text-primary-on-dark);
-    @include mdc-ripple-color(text-primary-on-dark, $mdc-filled-button-ripple-opacity);
+    @include mdc-states(text-primary-on-dark);
   } @else {
     @include mdc-button-ink-color(text-primary-on-light);
-    @include mdc-ripple-color(text-primary-on-light, $mdc-filled-button-ripple-opacity);
+    @include mdc-states(text-primary-on-light);
   }
 }
 
diff --git a/packages/mdc-button/_variables.scss b/packages/mdc-button/_variables.scss
index 373c10ba75e..3347b353745 100644
--- a/packages/mdc-button/_variables.scss
+++ b/packages/mdc-button/_variables.scss
@@ -18,6 +18,3 @@ $mdc-button-height: 36px;
 $mdc-button-horizontal-padding: 16px;
 $mdc-dense-button-height: 32px;
 $mdc-compact-button-horizontal-padding: 8px;
-
-$mdc-unfilled-button-ripple-opacity: .16;
-$mdc-filled-button-ripple-opacity: .32;
diff --git a/packages/mdc-button/mdc-button.scss b/packages/mdc-button/mdc-button.scss
index 9c5f238cd70..4177ce3a2da 100644
--- a/packages/mdc-button/mdc-button.scss
+++ b/packages/mdc-button/mdc-button.scss
@@ -25,7 +25,7 @@
   @include mdc-button-corner-radius(2px);
   @include mdc-button-container-fill-color(transparent);
   @include mdc-button-ink-color(primary);
-  @include mdc-ripple-color(primary, $mdc-unfilled-button-ripple-opacity);
+  @include mdc-states(primary);
 }
 
 .mdc-button--raised,
@@ -33,7 +33,7 @@
   @include mdc-button--filled_;
   @include mdc-button-container-fill-color(primary);
   @include mdc-button-ink-color(text-primary-on-primary);
-  @include mdc-ripple-color(text-primary-on-primary, $mdc-filled-button-ripple-opacity);
+  @include mdc-states(text-primary-on-primary);
 }
 
 .mdc-button--raised {