diff --git a/gallery/src/pages/components/ha-control-slider.ts b/gallery/src/pages/components/ha-control-slider.ts
index efc61bb46146..bb46f7ff7294 100644
--- a/gallery/src/pages/components/ha-control-slider.ts
+++ b/gallery/src/pages/components/ha-control-slider.ts
@@ -97,7 +97,7 @@ export class DemoHaBarSlider extends LitElement {
                 @value-changed=${this.handleValueChanged}
                 @slider-moved=${this.handleSliderMoved}
                 aria-labelledby=${id}
-                .tooltipUnit=${config.unit}
+                .unit=${config.unit}
               >
               </ha-control-slider>
             </div>
@@ -119,7 +119,7 @@ export class DemoHaBarSlider extends LitElement {
                   @value-changed=${this.handleValueChanged}
                   @slider-moved=${this.handleSliderMoved}
                   aria-label=${label}
-                  .tooltipUnit=${config.unit}
+                  .unit=${config.unit}
                 >
                 </ha-control-slider>
               `;
diff --git a/src/components/ha-control-slider.ts b/src/components/ha-control-slider.ts
index 76183d45378e..45de3c4c0f9d 100644
--- a/src/components/ha-control-slider.ts
+++ b/src/components/ha-control-slider.ts
@@ -61,8 +61,8 @@ export class HaControlSlider extends LitElement {
   @property({ attribute: "tooltip-position" })
   public tooltipPosition?: TooltipPosition;
 
-  @property({ attribute: "tooltip-unit" })
-  public tooltipUnit?: string;
+  @property()
+  public unit?: string;
 
   @property({ attribute: "tooltip-mode" })
   public tooltipMode: TooltipMode = "interaction";
@@ -292,8 +292,8 @@ export class HaControlSlider extends LitElement {
   private _formatValue(value: number) {
     const formattedValue = formatNumber(value, this.locale);
 
-    const formattedUnit = this.tooltipUnit
-      ? `${blankBeforeUnit(this.tooltipUnit, this.locale)}${this.tooltipUnit}`
+    const formattedUnit = this.unit
+      ? `${blankBeforeUnit(this.unit, this.locale)}${this.unit}`
       : "";
 
     return `${formattedValue}${formattedUnit}`;
diff --git a/src/dialogs/more-info/components/cover/ha-more-info-cover-position.ts b/src/dialogs/more-info/components/cover/ha-more-info-cover-position.ts
index ab13306eadd7..1ca869078ef1 100644
--- a/src/dialogs/more-info/components/cover/ha-more-info-cover-position.ts
+++ b/src/dialogs/more-info/components/cover/ha-more-info-cover-position.ts
@@ -61,7 +61,7 @@ export class HaMoreInfoCoverPosition extends LitElement {
           "--control-slider-background": color,
         })}
         .disabled=${this.stateObj.state === UNAVAILABLE}
-        .tooltipUnit=${DOMAIN_ATTRIBUTES_UNITS.cover.current_position}
+        .unit=${DOMAIN_ATTRIBUTES_UNITS.cover.current_position}
         .locale=${this.hass.locale}
       >
       </ha-control-slider>
diff --git a/src/dialogs/more-info/components/cover/ha-more-info-cover-tilt-position.ts b/src/dialogs/more-info/components/cover/ha-more-info-cover-tilt-position.ts
index d5c2113743ba..85407c34db61 100644
--- a/src/dialogs/more-info/components/cover/ha-more-info-cover-tilt-position.ts
+++ b/src/dialogs/more-info/components/cover/ha-more-info-cover-tilt-position.ts
@@ -97,7 +97,7 @@ export class HaMoreInfoCoverTiltPosition extends LitElement {
           "--control-slider-background": color,
         })}
         .disabled=${this.stateObj.state === UNAVAILABLE}
-        .tooltipUnit=${DOMAIN_ATTRIBUTES_UNITS.cover.current_tilt_position}
+        .unit=${DOMAIN_ATTRIBUTES_UNITS.cover.current_tilt_position}
         .locale=${this.hass.locale}
       >
         <div slot="background" class="gradient"></div>
diff --git a/src/dialogs/more-info/components/fan/ha-more-info-fan-speed.ts b/src/dialogs/more-info/components/fan/ha-more-info-fan-speed.ts
index 7146131040db..dbb501865700 100644
--- a/src/dialogs/more-info/components/fan/ha-more-info-fan-speed.ts
+++ b/src/dialogs/more-info/components/fan/ha-more-info-fan-speed.ts
@@ -131,7 +131,7 @@ export class HaMoreInfoFanSpeed extends LitElement {
           "--control-slider-background": color,
         })}
         .disabled=${this.stateObj.state === UNAVAILABLE}
-        .tooltipUnit=${DOMAIN_ATTRIBUTES_UNITS.fan.percentage}
+        .unit=${DOMAIN_ATTRIBUTES_UNITS.fan.percentage}
         .locale=${this.hass.locale}
       >
       </ha-control-slider>
diff --git a/src/dialogs/more-info/components/lights/ha-more-info-light-brightness.ts b/src/dialogs/more-info/components/lights/ha-more-info-light-brightness.ts
index 587df1047b38..166116722475 100644
--- a/src/dialogs/more-info/components/lights/ha-more-info-light-brightness.ts
+++ b/src/dialogs/more-info/components/lights/ha-more-info-light-brightness.ts
@@ -77,7 +77,7 @@ export class HaMoreInfoLightBrightness extends LitElement {
           "--control-slider-background": color,
         })}
         .disabled=${this.stateObj.state === UNAVAILABLE}
-        .tooltipUnit=${"%"}
+        unit="%"
         .locale=${this.hass.locale}
       >
       </ha-control-slider>
diff --git a/src/dialogs/more-info/components/lights/light-color-temp-picker.ts b/src/dialogs/more-info/components/lights/light-color-temp-picker.ts
index 1f645e32c635..817653e8942c 100644
--- a/src/dialogs/more-info/components/lights/light-color-temp-picker.ts
+++ b/src/dialogs/more-info/components/lights/light-color-temp-picker.ts
@@ -94,7 +94,7 @@ class LightColorTempPicker extends LitElement {
           "--gradient": gradient,
         })}
         .disabled=${this.stateObj.state === UNAVAILABLE}
-        .tooltipUnit=${DOMAIN_ATTRIBUTES_UNITS.light.color_temp_kelvin}
+        .unit=${DOMAIN_ATTRIBUTES_UNITS.light.color_temp_kelvin}
         .locale=${this.hass.locale}
       >
       </ha-control-slider>
diff --git a/src/panels/lovelace/tile-features/hui-cover-position-tile-feature.ts b/src/panels/lovelace/tile-features/hui-cover-position-tile-feature.ts
index e4fe3a6ae31e..a209d44e41eb 100644
--- a/src/panels/lovelace/tile-features/hui-cover-position-tile-feature.ts
+++ b/src/panels/lovelace/tile-features/hui-cover-position-tile-feature.ts
@@ -94,7 +94,7 @@ class HuiCoverPositionTileFeature
             "current_position"
           )}
           .disabled=${this.stateObj!.state === UNAVAILABLE}
-          .tooltipUnit=${DOMAIN_ATTRIBUTES_UNITS.cover.current_position}
+          .unit=${DOMAIN_ATTRIBUTES_UNITS.cover.current_position}
           .locale=${this.hass.locale}
         ></ha-control-slider>
       </div>
diff --git a/src/panels/lovelace/tile-features/hui-cover-tilt-position-tile-feature.ts b/src/panels/lovelace/tile-features/hui-cover-tilt-position-tile-feature.ts
index 7607527d0b09..20ef0366f5b7 100644
--- a/src/panels/lovelace/tile-features/hui-cover-tilt-position-tile-feature.ts
+++ b/src/panels/lovelace/tile-features/hui-cover-tilt-position-tile-feature.ts
@@ -93,7 +93,7 @@ class HuiCoverTiltPositionTileFeature
             "current_tilt_position"
           )}
           .disabled=${this.stateObj!.state === UNAVAILABLE}
-          .tooltipUnit=${DOMAIN_ATTRIBUTES_UNITS.cover.current_tilt_position}
+          .unit=${DOMAIN_ATTRIBUTES_UNITS.cover.current_tilt_position}
           .locale=${this.hass.locale}
         >
           <div slot="background" class="gradient"></div
diff --git a/src/panels/lovelace/tile-features/hui-fan-speed-tile-feature.ts b/src/panels/lovelace/tile-features/hui-fan-speed-tile-feature.ts
index 4b587fb71b7e..5aa410fbf2b3 100644
--- a/src/panels/lovelace/tile-features/hui-fan-speed-tile-feature.ts
+++ b/src/panels/lovelace/tile-features/hui-fan-speed-tile-feature.ts
@@ -127,7 +127,7 @@ class HuiFanSpeedTileFeature extends LitElement implements LovelaceTileFeature {
             "percentage"
           )}
           .disabled=${this.stateObj!.state === UNAVAILABLE}
-          .tooltipUnit=${DOMAIN_ATTRIBUTES_UNITS.fan.percentage}
+          .unit=${DOMAIN_ATTRIBUTES_UNITS.fan.percentage}
           .locale=${this.hass.locale}
         ></ha-control-slider>
       </div>
diff --git a/src/panels/lovelace/tile-features/hui-light-brightness-tile-feature.ts b/src/panels/lovelace/tile-features/hui-light-brightness-tile-feature.ts
index a08bbf243033..512295ca7e0d 100644
--- a/src/panels/lovelace/tile-features/hui-light-brightness-tile-feature.ts
+++ b/src/panels/lovelace/tile-features/hui-light-brightness-tile-feature.ts
@@ -67,7 +67,7 @@ class HuiLightBrightnessTileFeature
           .disabled=${this.stateObj!.state === UNAVAILABLE}
           @value-changed=${this._valueChanged}
           .label=${this.hass.localize("ui.card.light.brightness")}
-          .tooltipUnit=${"%"}
+          unit="%"
           .locale=${this.hass.locale}
         ></ha-control-slider>
       </div>
diff --git a/src/panels/lovelace/tile-features/hui-light-color-temp-tile-feature.ts b/src/panels/lovelace/tile-features/hui-light-color-temp-tile-feature.ts
index 7d641679d7e4..6642fd50708d 100644
--- a/src/panels/lovelace/tile-features/hui-light-color-temp-tile-feature.ts
+++ b/src/panels/lovelace/tile-features/hui-light-color-temp-tile-feature.ts
@@ -86,7 +86,7 @@ class HuiLightColorTempTileFeature
           style=${styleMap({
             "--gradient": gradient,
           })}
-          .tooltipUnit=${DOMAIN_ATTRIBUTES_UNITS.light.color_temp_kelvin}
+          .unit=${DOMAIN_ATTRIBUTES_UNITS.light.color_temp_kelvin}
           .locale=${this.hass.locale}
         ></ha-control-slider>
       </div>