diff --git a/src/dialogs/more-info/controls/more-info-light.ts b/src/dialogs/more-info/controls/more-info-light.ts
index 9296454f727c..041e34ace3e6 100644
--- a/src/dialogs/more-info/controls/more-info-light.ts
+++ b/src/dialogs/more-info/controls/more-info-light.ts
@@ -105,26 +105,6 @@ class MoreInfoLight extends LitElement {
                     ></ha-labeled-slider>
                   `
                 : ""}
-              ${supportsFeature(this.stateObj, SUPPORT_COLOR)
-                ? html`
-                    <div class="segmentationContainer">
-                      <ha-color-picker
-                        class="color"
-                        @colorselected=${this._colorPicked}
-                        .desiredHsColor=${this._colorPickerColor}
-                        throttle="500"
-                        .hueSegments=${this._hueSegments}
-                        .saturationSegments=${this._saturationSegments}
-                      >
-                      </ha-color-picker>
-                      <ha-icon-button
-                        icon="hass:palette"
-                        @click=${this._segmentClick}
-                        class="segmentationButton"
-                      ></ha-icon-button>
-                    </div>
-                  `
-                : ""}
               ${supportsFeature(this.stateObj, SUPPORT_EFFECT) &&
               this.stateObj!.attributes.effect_list?.length
                 ? html`
@@ -147,6 +127,26 @@ class MoreInfoLight extends LitElement {
                     </ha-paper-dropdown-menu>
                   `
                 : ""}
+              ${supportsFeature(this.stateObj, SUPPORT_COLOR)
+                ? html`
+                    <div class="segmentationContainer">
+                      <ha-color-picker
+                        class="color"
+                        @colorselected=${this._colorPicked}
+                        .desiredHsColor=${this._colorPickerColor}
+                        throttle="500"
+                        .hueSegments=${this._hueSegments}
+                        .saturationSegments=${this._saturationSegments}
+                      >
+                      </ha-color-picker>
+                      <ha-icon-button
+                        icon="hass:palette"
+                        @click=${this._segmentClick}
+                        class="segmentationButton"
+                      ></ha-icon-button>
+                    </div>
+                  `
+                : ""}
             `
           : ""}
         <ha-attributes