diff --git a/src/dialogs/more-info/controls/more-info-light.ts b/src/dialogs/more-info/controls/more-info-light.ts
index 772d0ea29d..7ce5896ad6 100644
--- a/src/dialogs/more-info/controls/more-info-light.ts
+++ b/src/dialogs/more-info/controls/more-info-light.ts
@@ -61,20 +61,20 @@ class MoreInfoLight extends LitElement {
           "is-on": this.stateObj.state === "on",
         })}"
       >
+        ${supportsFeature(this.stateObj!, SUPPORT_BRIGHTNESS)
+          ? html`
+              <ha-labeled-slider
+                caption=${this.hass.localize("ui.card.light.brightness")}
+                icon="hass:brightness-5"
+                min="1"
+                max="255"
+                value=${this._brightnessSliderValue}
+                @change=${this._brightnessSliderChanged}
+              ></ha-labeled-slider>
+            `
+          : ""}
         ${this.stateObj.state === "on"
           ? html`
-              ${supportsFeature(this.stateObj!, SUPPORT_BRIGHTNESS)
-                ? html`
-                    <ha-labeled-slider
-                      caption=${this.hass.localize("ui.card.light.brightness")}
-                      icon="hass:brightness-5"
-                      min="1"
-                      max="255"
-                      value=${this._brightnessSliderValue}
-                      @change=${this._brightnessSliderChanged}
-                    ></ha-labeled-slider>
-                  `
-                : ""}
               ${supportsFeature(this.stateObj, SUPPORT_COLOR_TEMP)
                 ? html`
                     <ha-labeled-slider