diff --git a/src/editor/components/seZoom.js b/src/editor/components/seZoom.js
index 3bd40e89..b238d24f 100644
--- a/src/editor/components/seZoom.js
+++ b/src/editor/components/seZoom.js
@@ -116,6 +116,18 @@ class Zoom extends ListComboBox {
       this.$input.shadowRoot.querySelector('[part~="input"]').style.width = this[internal.state].inputsize
     }
     if (changed.inputPartType) {
+      const self = this
+      this.$input.setAttribute('step', '10')
+      this.$input.setAttribute('min', '0')
+      // Handle NumberSpinBox input.
+      this.$input.addEventListener('change', function (e) {
+        e.preventDefault()
+        const value = e.detail?.value
+        if (value) {
+          const changeEvent = new CustomEvent('change', { detail: { value } })
+          self.dispatchEvent(changeEvent)
+        }
+      })
       // Wire up handler on new input.
       this.addEventListener('close', (e) => {
         e.preventDefault()
diff --git a/src/editor/panels/BottomPanel.js b/src/editor/panels/BottomPanel.js
index cecba2ea..29b1ca30 100644
--- a/src/editor/panels/BottomPanel.js
+++ b/src/editor/panels/BottomPanel.js
@@ -56,7 +56,7 @@ class BottomPanel {
         break
       default:
       {
-        const zoomlevel = Number(value) > 0.1 ? Number(value) > 0.1 : 0.1
+        const zoomlevel = Number(value) > 0.1 ? Number(value) * 0.01 : 0.1
         const zoom = this.editor.svgCanvas.getZoom()
         const { workarea } = this.editor
         this.editor.zoomChanged(window, {