diff --git a/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs b/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
index fd0fe6d36a..81881d8109 100644
--- a/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/style_dictionary.cljs
@@ -6,8 +6,7 @@
    [app.main.ui.workspace.tokens.token :as wtt]
    [cuerdas.core :as str]
    [promesa.core :as p]
-   [rumext.v2 :as mf]
-   [shadow.resource]))
+   [rumext.v2 :as mf]))
 
 (def StyleDictionary
   "The global StyleDictionary instance used as an external library for now,
@@ -82,10 +81,12 @@
                            (fn [acc ^js cur]
                              (let [id (uuid (.-uuid (.-id cur)))
                                    origin-token (get tokens id)
-                                   resolved-value (wtt/parse-token-value (.-value cur))
-                                   resolved-token (if (not resolved-value)
+                                   parsed-value (wtt/parse-token-value (.-value cur))
+                                   resolved-token (if (not parsed-value)
                                                     (assoc origin-token :errors [:style-dictionary/missing-reference])
-                                                    (assoc origin-token :resolved-value resolved-value))]
+                                                    (assoc origin-token
+                                                           :resolved-value (:value parsed-value)
+                                                           :resolved-unit (:unit parsed-value)))]
                                (assoc acc (wtt/token-identifier resolved-token) resolved-token)))
                            {} sd-tokens)]
       (when debug?
@@ -157,9 +158,12 @@
 
    (#(resolve-sd-tokens+ % {:debug? true})))
 
+  (defonce output (atom nil))
+  (require '[shadow.resource])
   (let [example (-> (shadow.resource/inline "./data/example-tokens-set.json")
                     (js/JSON.parse)
                     .-core)]
-    (resolve-sd-tokens+ example {:debug? true}))
+    (.then (resolve-sd-tokens+ example {:debug? true})
+           #(reset! output %)))
 
   nil)
diff --git a/frontend/src/app/main/ui/workspace/tokens/token.cljs b/frontend/src/app/main/ui/workspace/tokens/token.cljs
index a641295379..aabfdf412a 100644
--- a/frontend/src/app/main/ui/workspace/tokens/token.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/token.cljs
@@ -5,14 +5,15 @@
    [cuerdas.core :as str]))
 
 (def parseable-token-value-regexp
-  #"^\s*(-?[0-9]+\.?[0-9]*)\s*$")
+  #"^\s*(-?[0-9]+\.?[0-9]*)(px|%)?\s*$")
 
 (defn parse-token-value [value]
   (cond
-    (number? value) value
-    (string? value) (when-let [double-str (-> (re-find parseable-token-value-regexp value)
-                                              (last))]
-                      (d/parse-double double-str))))
+    (number? value) {:value value}
+    (string? value) (when-let [[_ value unit] (re-find parseable-token-value-regexp value)]
+                      (when-let [parsed-value (d/parse-double value)]
+                        {:value parsed-value
+                         :unit unit}))))
 
 (defn find-token-references
   "Finds token reference values in `value-string` and returns a set with all contained namespaces."
diff --git a/frontend/test/token_tests/token_test.cljs b/frontend/test/token_tests/token_test.cljs
index 77cb674ae2..4b38c889cc 100644
--- a/frontend/test/token_tests/token_test.cljs
+++ b/frontend/test/token_tests/token_test.cljs
@@ -11,14 +11,19 @@
 
 (t/deftest test-parse-token-value
   (t/testing "parses double from a token value"
-    (t/is (= 100.1 (wtt/parse-token-value "100.1")))
-    (t/is (= -9 (wtt/parse-token-value "-9")))
-    (t/testing "trims white-space"
-      (t/is (= -1.3 (wtt/parse-token-value "     -1.3   "))))
-    (t/testing "returns nil for any invalid characters"
-      (t/is (nil? (wtt/parse-token-value "     -1.3a   "))))
-    (t/testing "doesnt accept invalid double"
-      (t/is (nil? (wtt/parse-token-value ".3"))))))
+    (t/is (= {:value 100.1 :unit nil} (wtt/parse-token-value "100.1")))
+    (t/is (= {:value -9 :unit nil} (wtt/parse-token-value "-9"))))
+  (t/testing "trims white-space"
+    (t/is (= {:value -1.3 :unit nil} (wtt/parse-token-value "     -1.3   "))))
+  (t/testing "parses unit: px"
+    (t/is (= {:value 70.3 :unit "px"} (wtt/parse-token-value "     70.3px   "))))
+  (t/testing "parses unit: %"
+    (t/is (= {:value -10 :unit "%"} (wtt/parse-token-value "-10%"))))
+  (t/testing "parses unit: px")
+  (t/testing "returns nil for any invalid characters"
+    (t/is (nil? (wtt/parse-token-value "     -1.3a   "))))
+  (t/testing "doesnt accept invalid double"
+    (t/is (nil? (wtt/parse-token-value ".3")))))
 
 (t/deftest find-token-references
   (t/testing "finds references inside curly braces in a string"