diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml
index d07812f02fd..8006be8ffa1 100644
--- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml
+++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/ColorEditor.qml
@@ -1075,6 +1075,20 @@ SecondColumnLayout {
                             Layout.fillWidth: true
                             spacing: 0
 
+                            Connections {
+                                target: ceMode
+                                function onActivated() {
+                                    spinBox.readValue()
+                                }
+                            }
+
+                            Connections {
+                                target: modelNodeBackend
+                                function onSelectionChanged() {
+                                    spinBox.readValue()
+                                }
+                            }
+
                             GradientPropertySpinBox {
                                 id: spinBox
                                 implicitWidth: StudioTheme.Values.controlGap
diff --git a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPropertySpinBox.qml b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPropertySpinBox.qml
index a1c3251335c..65b6c14c73d 100644
--- a/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPropertySpinBox.qml
+++ b/share/qtcreator/qmldesigner/propertyEditorQmlSources/imports/HelperWidgets/GradientPropertySpinBox.qml
@@ -45,6 +45,10 @@ Item {
 
     onFocusChanged: restoreCursor()
 
+    function readValue() {
+        spinBox.realValue = gradientLine.model.readGradientProperty(wrapper.propertyName)
+    }
+
     StudioControls.RealSpinBox {
         id: spinBox
 
@@ -56,9 +60,7 @@ Item {
         realStepSize: 1
         decimals: 0
 
-        Component.onCompleted: {
-            spinBox.realValue = gradientLine.model.readGradientProperty(wrapper.propertyName)
-        }
+        Component.onCompleted: wrapper.readValue()
         onCompressedRealValueModified: {
             gradientLine.model.setGradientProperty(wrapper.propertyName, spinBox.realValue)
         }