diff --git a/src/material/slider/_m2-slider.scss b/src/material/slider/_m2-slider.scss
index bdb16a22ed1b..c378cec27be8 100644
--- a/src/material/slider/_m2-slider.scss
+++ b/src/material/slider/_m2-slider.scss
@@ -28,6 +28,7 @@
       slider-with-tick-marks-container-shape: 50%,
       slider-with-tick-marks-container-size: 2px,
       slider-with-tick-marks-inactive-container-opacity: 0.6,
+      slider-value-indicator-transform-origin: bottom,
     ),
     color: map.merge(private-get-color-palette-color-tokens($theme, primary), (
       slider-disabled-active-track-color: map.get($system, on-surface),
diff --git a/src/material/slider/_m3-slider.scss b/src/material/slider/_m3-slider.scss
index 5bb89b21e8d7..b6b882310a98 100644
--- a/src/material/slider/_m3-slider.scss
+++ b/src/material/slider/_m3-slider.scss
@@ -7,6 +7,8 @@
 /// @param {String} $color-variant The color variant to use for the component
 @function get-tokens($theme: m3.$sys-theme, $color-variant: null) {
   $system: m3-utils.get-system($theme);
+  $indicator-size: 28px;
+
   @if $color-variant {
     $system: m3-utils.replace-colors-with-variant($system, primary, $color-variant);
   }
@@ -15,8 +17,8 @@
     base: (
       slider-value-indicator-opacity: 1,
       slider-value-indicator-padding: 0,
-      slider-value-indicator-width: 28px,
-      slider-value-indicator-height: 28px,
+      slider-value-indicator-width: $indicator-size,
+      slider-value-indicator-height: $indicator-size,
       slider-value-indicator-caret-display: none,
       slider-value-indicator-border-radius: 50% 50% 50% 0,
       slider-value-indicator-text-transform: rotate(45deg),
@@ -29,6 +31,7 @@
       slider-with-tick-marks-active-container-opacity: 0.38,
       slider-with-tick-marks-container-size: 2px,
       slider-with-tick-marks-inactive-container-opacity: 0.38,
+      slider-value-indicator-transform-origin: 0 $indicator-size,
     ),
     color: (
       slider-active-track-color: map.get($system, primary),
diff --git a/src/material/slider/slider.scss b/src/material/slider/slider.scss
index 6f2888d041e6..952f722af0c2 100644
--- a/src/material/slider/slider.scss
+++ b/src/material/slider/slider.scss
@@ -104,7 +104,7 @@ $fallbacks: m3-slider.get-tokens();
   display: flex;
   align-items: center;
   transform: scale(0);
-  transform-origin: bottom;
+  transform-origin: token-utils.slot(slider-value-indicator-transform-origin, $fallbacks);
   transition: transform 100ms cubic-bezier(0.4, 0, 1, 1);
 
   // Stop parent word-break from altering