diff --git a/demos/radio.scss b/demos/radio.scss
index 8d82332f081..7257429f861 100644
--- a/demos/radio.scss
+++ b/demos/radio.scss
@@ -17,6 +17,7 @@
 @import "./common";
 @import "../packages/mdc-form-field/mdc-form-field";
 @import "../packages/mdc-radio/mdc-radio";
+@import "../packages/mdc-ripple/mixins";
 @import "../packages/mdc-theme/color-palette";
 @import "../packages/mdc-typography/mdc-typography";
 
@@ -27,5 +28,5 @@
   @include mdc-radio-checked-stroke-color($color);
   @include mdc-radio-ink-color($material-color-orange-500);
   @include mdc-radio-focus-indicator-color($color);
-  @include mdc-radio-ripple((base-color: $color));
+  @include mdc-ripple-color($color, $mdc-radio-ripple-opacity);
 }
diff --git a/packages/mdc-radio/README.md b/packages/mdc-radio/README.md
index bf1863a33db..06badee4f24 100644
--- a/packages/mdc-radio/README.md
+++ b/packages/mdc-radio/README.md
@@ -211,9 +211,8 @@ Mixin | Description
 `mdc-radio-checked-stroke-color($color)` | Sets the stroke color of a checked radio
 `mdc-radio-ink-color($color)` | Sets the ink color
 `mdc-radio-focus-indicator-color($color)` | Sets the color of the focus indicator
-`mdc-radio-ripple-color($ripple-config)` | Sets the ripple to the given [ripple configuration][ripple-readme]
 
-[ripple-readme]: https://github.com/material-components/material-components-web/blob/master/packages/mdc-ripple/README.md
+The ripple effect for the Radio Button component is styled using [MDC Ripple](../mdc-ripple) mixins.
 
 ### Caveat: Edge and CSS Variables
 
diff --git a/packages/mdc-radio/_mixins.scss b/packages/mdc-radio/_mixins.scss
index 9508e9715fb..18df1067aab 100644
--- a/packages/mdc-radio/_mixins.scss
+++ b/packages/mdc-radio/_mixins.scss
@@ -43,10 +43,3 @@
     @include mdc-theme-prop(background-color, $color, $edgeOptOut: true);
   }
 }
-
-@mixin mdc-radio-ripple($ripple-config) {
-  $ripple-config: map-merge((opacity: $mdc-radio-ripple-opacity, radius: 50%), $ripple-config);
-
-  @include mdc-ripple-bg(map-merge($ripple-config, (pseudo: "::before")));
-  @include mdc-ripple-fg(map-merge($ripple-config, (pseudo: "::after")));
-}
diff --git a/packages/mdc-radio/_variables.scss b/packages/mdc-radio/_variables.scss
index ae30c606a33..8fc397980d2 100644
--- a/packages/mdc-radio/_variables.scss
+++ b/packages/mdc-radio/_variables.scss
@@ -19,4 +19,5 @@ $mdc-radio-ui-size: 20px;
 $mdc-radio-ui-pct: percentage($mdc-radio-ui-size / $mdc-radio-touch-area);
 $mdc-radio-transition-duration: 120ms;
 $mdc-radio-ripple-opacity: .14;
+$mdc-radio-ripple-radius: 50%;
 $mdc-radio-baseline-theme-color: secondary;
diff --git a/packages/mdc-radio/mdc-radio.scss b/packages/mdc-radio/mdc-radio.scss
index f2341799871..2436db170ff 100644
--- a/packages/mdc-radio/mdc-radio.scss
+++ b/packages/mdc-radio/mdc-radio.scss
@@ -23,7 +23,6 @@
 
 // postcss-bem-linter: define radio
 .mdc-radio {
-  @include mdc-ripple-base;
   @include mdc-radio-unchecked-stroke-color(text-secondary-on-light);
 
   @include mdc-theme-dark {
@@ -33,7 +32,9 @@
   @include mdc-radio-checked-stroke-color($mdc-radio-baseline-theme-color);
   @include mdc-radio-ink-color($mdc-radio-baseline-theme-color);
   @include mdc-radio-focus-indicator-color($mdc-radio-baseline-theme-color);
-  @include mdc-radio-ripple((theme-style: $mdc-radio-baseline-theme-color));
+  @include mdc-ripple-surface;
+  @include mdc-ripple-color($mdc-radio-baseline-theme-color, $mdc-radio-ripple-opacity);
+  @include mdc-ripple-radius($mdc-radio-ripple-radius);
 
   display: inline-block;
   position: relative;