diff --git a/frontend/src/app/main/ui/workspace/tokens/form.cljs b/frontend/src/app/main/ui/workspace/tokens/form.cljs
index a4039a3dc..b9e817d91 100644
--- a/frontend/src/app/main/ui/workspace/tokens/form.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/form.cljs
@@ -260,7 +260,8 @@
         touched-name? (deref touched-name*)
         warning-name-change* (mf/use-state false)
         warning-name-change? (deref warning-name-change*)
-        name-ref (mf/use-var (:name token))
+        token-name-ref (mf/use-var (:name token))
+        name-ref (mf/use-ref nil)
         name-errors (mf/use-state nil)
         validate-name
         (mf/use-fn
@@ -285,23 +286,26 @@
 
         on-update-name-debounced
         (mf/use-fn
-         (uf/debounce (fn [e]
-                        (let [value (dom/get-target-val e)
-                              errors (validate-name value)]
+         (mf/deps touched-name? validate-name)
+         (uf/debounce (fn [token-name]
+                        (let [errors (validate-name token-name)]
                           (when touched-name?
-                            (reset! name-errors errors))))))
+                            (reset! name-errors errors))))
+                      300))
 
         on-update-name
         (mf/use-fn
-         (mf/deps on-update-name-debounced)
-         (fn [e]
-           (reset! touched-name* true)
-           (reset! name-ref (dom/get-target-val e))
-           (on-update-name-debounced e)))
+         (mf/deps on-update-name-debounced name-ref)
+         (fn []
+           (let [ref (mf/ref-val name-ref)
+                 token-name (dom/get-value ref)]
+             (reset! touched-name* true)
+             (reset! token-name-ref token-name)
+             (on-update-name-debounced token-name))))
 
         valid-name-field? (and
                            (not @name-errors)
-                           (valid-name? @name-ref))
+                           (valid-name? @token-name-ref))
 
         ;; Value
         color (mf/use-state (when color? (:value token)))
@@ -330,7 +334,7 @@
              (when color? (reset! color (if error? nil v)))
              (reset! token-resolve-result* v))))
 
-        on-update-value-debounced (use-debonced-resolve-callback name-ref token active-theme-tokens set-resolve-value)
+        on-update-value-debounced (use-debonced-resolve-callback token-name-ref token active-theme-tokens set-resolve-value)
         on-update-value (mf/use-fn
                          (mf/deps on-update-value-debounced)
                          (fn [e]
@@ -401,7 +405,7 @@
            ;; because the validation is asynchronous/debounced
            ;; and the user might have edited a valid form to make it invalid,
            ;; and press enter before the next validations could return.
-           (let [final-name (finalize-name @name-ref)
+           (let [final-name (finalize-name @token-name-ref)
                  valid-name?+ (-> (validate-name final-name) schema-validation->promise)
                  final-value (finalize-value @value-ref)
                  final-description @description-ref
@@ -476,7 +480,7 @@
        (when (and (not create?)
                   (not token-resolve-result)
                   resolved-tokens)
-         (-> (get resolved-tokens @name-ref)
+         (-> (get resolved-tokens @token-name-ref)
              (set-resolve-value)))))
 
     [:form {:class (stl/css :form-wrapper)
@@ -495,7 +499,8 @@
            :error (boolean @name-errors)
            :auto-focus true
            :label (tr "workspace.token.token-name")
-           :default-value @name-ref
+           :default-value @token-name-ref
+           :ref name-ref
            :max-length 256
            :on-blur on-blur-name
            :on-change on-update-name}])