diff --git a/include/gz/gui/qml/GzCardSettings.qml b/include/gz/gui/qml/GzCardSettings.qml
index b3e571203..cde4c4bbf 100644
--- a/include/gz/gui/qml/GzCardSettings.qml
+++ b/include/gz/gui/qml/GzCardSettings.qml
@@ -135,7 +135,7 @@ Dialog {
 
       GzSpinBox {
         visible: !cardPane.anchored
-        to: cardPane.parent ? cardPane.parent.width - cardPane.width : from
+        maximumValue: cardPane.parent ? cardPane.parent.width - cardPane.width : minSize
         onVisibleChanged: value = cardPane.x
         onValueChanged: {
           cardPane.x = value;
@@ -147,7 +147,7 @@ Dialog {
       }
       GzSpinBox {
         visible: !cardPane.anchored
-        to: cardPane.parent ? cardPane.parent.height - cardPane.height : from
+        maximumValue: cardPane.parent ? cardPane.parent.height - cardPane.height : minSize
         onVisibleChanged: value = cardPane.y
         onValueChanged: {
           cardPane.y = value;
@@ -159,7 +159,7 @@ Dialog {
       }
       GzSpinBox {
         visible: !cardPane.anchored
-        to: 10000
+        maximumValue: 10000
         onVisibleChanged: value = cardPane.z
         onValueChanged: {
           cardPane.z = value;
@@ -177,7 +177,7 @@ Dialog {
         text: ""
       }
       GzSpinBox {
-        to: cardPane.parent ? cardPane.parent.width : from
+        maximumValue: cardPane.parent ? cardPane.parent.width : minSize
         onVisibleChanged: {
           if (cardPane)
             value = cardPane.width
@@ -190,8 +190,7 @@ Dialog {
         text: "Width"
       }
       GzSpinBox {
-        to: cardPane.parent ? cardPane.parent.height : from
-
+        maximumValue: cardPane.parent ? cardPane.parent.height : minSize
         onVisibleChanged: {
           if (cardPane)
             value = cardPane.height
diff --git a/include/gz/gui/qml/GzPose.qml b/include/gz/gui/qml/GzPose.qml
index 8951464b6..5037258b0 100644
--- a/include/gz/gui/qml/GzPose.qml
+++ b/include/gz/gui/qml/GzPose.qml
@@ -78,7 +78,7 @@ Item {
   signal gzPoseSet(double _x, double _y, double _z, double _roll, double _pitch, double _yaw)
 
   // Maximum spinbox value
-  property int spinMax: Number.MAX_VALUE
+  property double spinMax: Number.MAX_VALUE
 
   // Expand/Collapse of this widget
   property bool expand: true
@@ -119,10 +119,10 @@ Item {
     GzSpinBox {
       id: writableSpin
       value:  numberValue
-      from: -spinMax
-      to: spinMax
-      //decimals: gzHelper.getDecimals(writableSpin.width)
-      onValueChanged: {
+      minimumValue: -spinMax
+      maximumValue: spinMax
+      decimals: gzHelper.getDecimals(writableSpin.width)
+      onEditingFinished: {
         gzPoseRoot.gzPoseSet(xItem.value, yItem.value, zItem.value,
                              rollItem.value, pitchItem.value, yawItem.value)
       }
diff --git a/include/gz/gui/qml/GzSpinBox.qml b/include/gz/gui/qml/GzSpinBox.qml
index ce955bd47..2fa49a5fb 100644
--- a/include/gz/gui/qml/GzSpinBox.qml
+++ b/include/gz/gui/qml/GzSpinBox.qml
@@ -17,10 +17,39 @@
 import QtQuick
 import QtQuick.Controls
 
-SpinBox {
-  background: Rectangle {
-    implicitWidth: 70
-    implicitHeight: 40
-    border.color: "gray"
-  }
+Item {
+    id: root
+    property int decimals: 2
+    property real value: 0.0
+    property real from: 0.0
+    property real to: 100.0
+    property alias minimumValue: root.from
+    property alias maximumValue: root.to
+    property real stepSize: 1.0
+    signal editingFinished(real _value)
+
+    SpinBox{
+        id: spinbox
+        property real factor: Math.pow(10, root.decimals)
+        stepSize: root.stepSize*factor
+        value: root.value*factor
+        to : root.to*factor
+        from : root.from*factor
+        editable: true
+
+        validator: DoubleValidator {
+            bottom: Math.min(spinbox.from, spinbox.to)
+            top:  Math.max(spinbox.from, spinbox.to)
+        }
+
+        textFromValue: function(value, locale) {
+            return Number(value / factor).toLocaleString(locale, 'f', root.decimals)
+        }
+
+        valueFromText: function(text, locale) {
+            return Math.round(Number.fromLocaleString(locale, text) * factor)
+        }
+
+        onValueChanged: root.editingFinished(spinbox.value / spinbox.factor)
+    }
 }
diff --git a/src/plugins/GridConfig/GridConfig.qml b/src/plugins/GridConfig/GridConfig.qml
index e67522174..245f03daf 100644
--- a/src/plugins/GridConfig/GridConfig.qml
+++ b/src/plugins/GridConfig/GridConfig.qml
@@ -112,10 +112,10 @@ GridLayout {
     Layout.columnSpan: 2
     Layout.fillWidth: true
     id: verticalCellCount
-    to: Number.MAX_VALUE
-    from: 0
+    maximumValue: Number.MAX_VALUE
+    minimumValue: 0
     value: 0
-    onValueChanged: GridConfig.UpdateVCellCount(verticalCellCount.value)
+    onEditingFinished: GridConfig.UpdateVCellCount(verticalCellCount.value)
   }
 
   Text {
@@ -129,10 +129,10 @@ GridLayout {
     Layout.columnSpan: 2
     Layout.fillWidth: true
     id: horizontalCellCount
-    to: Number.MAX_VALUE
-    from: 1
+    maximumValue: Number.MAX_VALUE
+    minimumValue: 1
     value: 20
-    onValueChanged: GridConfig.UpdateHCellCount(horizontalCellCount.value)
+    onEditingFinished: GridConfig.UpdateHCellCount(horizontalCellCount.value)
   }
 
   Text {
@@ -153,12 +153,12 @@ GridLayout {
     Layout.columnSpan: 2
     Layout.fillWidth: true
     id: cellLength
-    to: Number.MAX_VALUE
-    from: 0
-    value: 1
-    //decimals: gzHelpers.getDecimals(cellLength.width)
-    stepSize: 1
-    onValueChanged: GridConfig.UpdateCellLength(cellLength.value)
+    maximumValue: Number.MAX_VALUE
+    minimumValue: 0
+    value: 1.00
+    decimals: gzHelpers.getDecimals(cellLength.width)
+    stepSize: 0.01
+    onEditingFinished: GridConfig.UpdateCellLength(cellLength.value)
   }
 
   Text {
diff --git a/src/plugins/PointCloud/PointCloud.qml b/src/plugins/PointCloud/PointCloud.qml
index 63c6b4c4c..6b1024919 100644
--- a/src/plugins/PointCloud/PointCloud.qml
+++ b/src/plugins/PointCloud/PointCloud.qml
@@ -121,9 +121,11 @@ ColumnLayout {
     GzSpinBox {
       id: pointSizeSpin
       value: PointCloud.pointSize
-      from: 1
+      minimumValue: 1
+      maximumValue: 1
+      decimals: 0
       to: 1000
-      onValueChanged: {
+      onEditingFinished: {
         PointCloud.SetPointSize(pointSizeSpin.value)
       }
     }
diff --git a/src/plugins/Teleop/Teleop.qml b/src/plugins/Teleop/Teleop.qml
index 278ce3fd0..db84829a9 100644
--- a/src/plugins/Teleop/Teleop.qml
+++ b/src/plugins/Teleop/Teleop.qml
@@ -123,11 +123,11 @@ ColumnLayout {
       id: maxForwardVelField
       Layout.fillWidth: true
       value: maxForwardVel
-      to: 10000
-      from: 0
-      // decimals: 2
-      stepSize: 1
-      onValueChanged:{
+      maximumValue: 10000.0
+      minimumValue: 0.0
+      decimals: 2
+      stepSize: 0.10
+      onEditingFinished: {
         Teleop.SetMaxForwardVel(value)
       }
     }
@@ -142,11 +142,11 @@ ColumnLayout {
       id: maxVerticalVelField
       Layout.fillWidth: true
       value: maxVerticalVel
-      to: 10000
-      from: 0
-      // decimals: 2
-      stepSize: 1
-      onValueChanged:{
+      maximumValue: 10000.0
+      minimumValue: 0.0
+      decimals: 2
+      stepSize: 0.10
+      onEditingFinished:{
         Teleop.SetMaxVerticalVel(value)
       }
     }
@@ -161,12 +161,12 @@ ColumnLayout {
       id: maxYawVelField
       Layout.fillWidth: true
       value: maxYawVel
-      to: 10000
-      from: 0
-      // decimals: 2
-      stepSize: 1
-      onValueChanged:{
-        Teleop.SetMaxYawVel(value)
+      maximumValue: 10000.0
+      minimumValue: 0.0
+      decimals: 2
+      stepSize: 0.10
+      onEditingFinished:{
+        Teleop.SetMaxYawVel(1.0)
       }
     }
   }
diff --git a/src/plugins/WorldControl/WorldControl.qml b/src/plugins/WorldControl/WorldControl.qml
index da35ae557..a10f2bff6 100644
--- a/src/plugins/WorldControl/WorldControl.qml
+++ b/src/plugins/WorldControl/WorldControl.qml
@@ -179,7 +179,7 @@ RowLayout {
         }
 
         GzSpinBox {
-          to: 10000
+          maximumValue: 10000
           Layout.alignment: Qt.AlignVCenter
           value: 1
           onValueChanged: {