diff --git a/frontend/src/app/main/ui/viewer/inspect/code.cljs b/frontend/src/app/main/ui/viewer/inspect/code.cljs
index 4676afd06..dff59ed74 100644
--- a/frontend/src/app/main/ui/viewer/inspect/code.cljs
+++ b/frontend/src/app/main/ui/viewer/inspect/code.cljs
@@ -7,37 +7,34 @@
 (ns app.main.ui.viewer.inspect.code
   (:require
    ["js-beautify" :as beautify]
+   ["react-dom/server" :as rds]
    [app.common.data.macros :as dm]
    [app.common.geom.shapes :as gsh]
-   [app.common.uuid :as uuid]
    [app.main.data.events :as ev]
    [app.main.refs :as refs]
+   [app.main.render :as render]
    [app.main.store :as st]
    [app.main.ui.components.code-block :refer [code-block]]
    [app.main.ui.components.copy-button :refer [copy-button]]
    [app.main.ui.hooks :as hooks]
    [app.main.ui.icons :as i]
    [app.util.code-gen :as cg]
-   [app.util.dom :as dom]
    [cuerdas.core :as str]
    [potok.core :as ptk]
    [rumext.v2 :as mf]))
 
-(defn generate-markup-code [_type shapes from]
-  (let [frame (if (= from :workspace)
-                (dom/query js/document (dm/str "#shape-" uuid/zero))
-                (dom/query js/document "#svg-frame"))
-        markup-shape
-        (fn [shape]
-          (let [selector (str "#shape-" (:id shape))]
-            (when-let [el (and frame (dom/query frame selector))]
-              (str
-               (str/fmt "<!-- %s -->" (:name shape))
-               (.-outerHTML el)))))]
-    (->> shapes
-         (map markup-shape )
-         (remove nil?)
-         (str/join "\n\n"))))
+(defn generate-markup-code [objects shapes]
+  ;; Here we can render specific HTML code
+  (->> shapes
+       (map (fn [shape]
+              (dm/str
+               "<!-- Shape: " (:name shape) " -->"
+               (rds/renderToStaticMarkup
+                (mf/element
+                 render/object-svg
+                 #js {:objects objects
+                      :object-id (-> shape :id)})))))
+       (str/join "\n\n")))
 
 (defn format-code [code type]
   (let [code (-> code
@@ -55,6 +52,16 @@
 
     (mf/deref get-layout-children-refs)))
 
+(defn get-objects [from]
+  (let [page-objects-ref
+        (mf/use-memo
+         (mf/deps from)
+         (fn []
+           (if (= from :workspace)
+             refs/workspace-page-objects
+             (refs/get-viewer-objects))))]
+    (mf/deref page-objects-ref)))
+
 (mf/defc code
   [{:keys [shapes frame on-expand from]}]
   (let [style-type  (mf/use-state "css")
@@ -64,12 +71,14 @@
         route      (mf/deref refs/route)
         page-id    (:page-id (:query-params route))
         flex-items (get-flex-elements page-id shapes from)
+        objects    (get-objects from)
         shapes     (map #(assoc % :flex-items flex-items) shapes)
         style-code (-> (cg/generate-style-code @style-type shapes)
                        (format-code "css"))
 
-        markup-code (-> (mf/use-memo (mf/deps shapes) #(generate-markup-code @markup-type shapes from))
-                        (format-code "svg"))
+        markup-code
+        (-> (mf/use-memo (mf/deps shapes) #(generate-markup-code objects shapes))
+            (format-code "svg"))
 
         on-markup-copied
         (mf/use-callback