diff --git a/src/components/material/TextNumber.vue b/src/components/material/TextNumber.vue
index ec61b771f..d52ff7e93 100644
--- a/src/components/material/TextNumber.vue
+++ b/src/components/material/TextNumber.vue
@@ -22,7 +22,7 @@
         />
       </svg>
     </HeroIcon>
-    <input ref="inp" v-model="cmp" type="number" class="w-8 bg-transparent" />
+    <input ref="inp" v-model="cmp" type="number" class="w-6 bg-transparent" />
     <HeroIcon
       class="
         bg-gray-200
diff --git a/src/preset.css b/src/preset.css
index a8961de62..009457c71 100644
--- a/src/preset.css
+++ b/src/preset.css
@@ -55,6 +55,7 @@ input[type='number']::-webkit-inner-spin-button {
 
 input[type='number'] {
   -moz-appearance: textfield;
+  text-align:center;
 }
 
 :root {