diff --git a/src/material/slider/_m2-slider.scss b/src/material/slider/_m2-slider.scss
index bdb16a22ed1b..4fdab932d345 100644
--- a/src/material/slider/_m2-slider.scss
+++ b/src/material/slider/_m2-slider.scss
@@ -14,6 +14,7 @@
       slider-handle-height: 20px,
       slider-handle-shape: 50%,
       slider-handle-width: 20px,
+      slider-thumb-diameter: 48px,
       slider-inactive-track-height: 4px,
       slider-inactive-track-shape: 9999px,
       slider-value-indicator-border-radius: 4px,
diff --git a/src/material/slider/_m3-slider.scss b/src/material/slider/_m3-slider.scss
index 5bb89b21e8d7..6702733a5430 100644
--- a/src/material/slider/_m3-slider.scss
+++ b/src/material/slider/_m3-slider.scss
@@ -24,6 +24,7 @@
       slider-active-track-height: 4px,
       slider-handle-height: 20px,
       slider-handle-width: 20px,
+      slider-thumb-diameter: 48px,
       slider-inactive-track-height: 4px,
       slider-with-overlap-handle-outline-width: 1px,
       slider-with-tick-marks-active-container-opacity: 0.38,
diff --git a/src/material/slider/slider-thumb.ts b/src/material/slider/slider-thumb.ts
index 13f8ac1375fd..6643e165f45c 100644
--- a/src/material/slider/slider-thumb.ts
+++ b/src/material/slider/slider-thumb.ts
@@ -117,7 +117,8 @@ export class MatSliderVisualThumb implements _MatSliderVisualThumb, AfterViewIni
       return;
     }
 
-    this._ripple.radius = 24;
+    const thumbDiameter = this._hostElement.offsetHeight || 48;
+    this._ripple.radius = thumbDiameter / 2;
     this._sliderInput = sliderInput;
     this._sliderInputEl = this._sliderInput._hostElement;
 
diff --git a/src/material/slider/slider.scss b/src/material/slider/slider.scss
index 6f2888d041e6..7a505d0e1ebe 100644
--- a/src/material/slider/slider.scss
+++ b/src/material/slider/slider.scss
@@ -175,8 +175,8 @@ $fallbacks: m3-slider.get-tokens();
   left: -24px;
   outline: none;
   position: absolute;
-  height: 48px;
-  width: 48px;
+  height: token-utils.slot(slider-thumb-diameter, $fallbacks);
+  width: token-utils.slot(slider-thumb-diameter, $fallbacks);
   pointer-events: none;
 
   .mdc-slider--discrete & {
@@ -299,7 +299,7 @@ $fallbacks: m3-slider.get-tokens();
   outline: none;
   vertical-align: middle;
   cursor: pointer;
-  height: 48px;
+  height: token-utils.slot(slider-thumb-diameter, $fallbacks);
   margin: 0 $mat-slider-horizontal-margin;
   position: relative;
   touch-action: pan-y;