diff --git a/snippets/shx-3d-render-input.liquid b/snippets/shx-3d-render-input.liquid
index 3b8d0f1..7f20e37 100644
--- a/snippets/shx-3d-render-input.liquid
+++ b/snippets/shx-3d-render-input.liquid
@@ -166,6 +166,20 @@
     import insertText from "https://cdn.jsdelivr.net/npm/insert-text-at-cursor@0.3.0/index.js";
 
     console.log("module loaded")
+
+    const emojiPicker = document.createElement("emoji-picker");
+    emojiPicker.classList = "light";
+    emojiPicker.style.width = "100%";
+
+    emojiPicker.addEventListener("emoji-click", (e) => {
+      insertText(document.querySelector("#shx-text1"), e.detail.unicode);
+    });
+
+    console.log("add picker");
+
+    document
+      .getElementsByClassName("shx-emoji-picker-popup")[0]
+      .appendChild(emojiPicker);
 </script>
 
 <script type="text/javascript"> 
@@ -444,9 +458,7 @@
                 </div>
             </div>
 
-            <div class="shx-emoji-picker-popup">
-                <emoji-picker class="light"></emoji-picker>
-            </div>
+            <div class="shx-emoji-picker-popup"></div>
         `;
     }