diff --git a/frontend/src/app/main/ui/workspace/sidebar/assets/components.cljs b/frontend/src/app/main/ui/workspace/sidebar/assets/components.cljs
index d8e81bf4ee..c5d7031771 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/assets/components.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/assets/components.cljs
@@ -311,7 +311,7 @@
   {::mf/wrap-props false}
   [{:keys [file-id is-local components listing-thumbs? open? force-open?
            reverse-sort? selected on-asset-click on-assets-delete
-           on-clear-selection open-status-ref count-variants]}]
+           on-clear-selection open-status-ref delete-component count-variants]}]
 
   (let [input-ref                (mf/use-ref nil)
 
@@ -393,7 +393,7 @@
              (if (or multi-components? multi-assets?)
                (on-assets-delete)
                (st/emit! (dwu/start-undo-transaction undo-id)
-                         (dwl/delete-component {:id current-component-id})
+                         (delete-component current-component-id)
                          (dwl/sync-file file-id file-id :components current-component-id)
                          (dwu/commit-undo-transaction undo-id))))))
 
diff --git a/frontend/src/app/main/ui/workspace/sidebar/assets/file_library.cljs b/frontend/src/app/main/ui/workspace/sidebar/assets/file_library.cljs
index 8529a65b2d..37a2a1b2b3 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/assets/file_library.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/assets/file_library.cljs
@@ -10,10 +10,12 @@
    [app.common.data :as d]
    [app.common.data.macros :as dm]
    [app.common.files.variant :as cfv]
+   [app.common.types.component :as ctc]
    [app.common.types.components-list :as ctkl]
    [app.main.data.event :as ev]
    [app.main.data.workspace :as dw]
    [app.main.data.workspace.libraries :as dwl]
+   [app.main.data.workspace.shapes :as dwsh]
    [app.main.data.workspace.undo :as dwu]
    [app.main.refs :as refs]
    [app.main.router :as rt]
@@ -210,13 +212,23 @@
         on-typography-click
         (mf/use-fn (mf/deps on-asset-click) (partial on-asset-click :typographies))
 
+        delete-component
+        (mf/use-fn
+         (mf/deps components)
+         (fn [component-id]
+           (let [component (some #(when (= (:id %) component-id) %) components)]
+             (if (ctc/is-variant? component)
+               ;; If the component is a variant, delete its variant container
+               (dwsh/delete-shapes (:main-instance-page component) #{(:variant-id component)})
+               (dwl/delete-component {:id component-id})))))
+
         on-assets-delete
         (mf/use-fn
          (mf/deps selected file-id)
          (fn []
            (let [undo-id (js/Symbol)]
              (st/emit! (dwu/start-undo-transaction undo-id))
-             (run! st/emit! (map #(dwl/delete-component {:id %})
+             (run! st/emit! (map delete-component
                                  (:components selected)))
              (run! st/emit! (map #(dwl/delete-media {:id %})
                                  (:graphics selected)))
@@ -251,6 +263,7 @@
             :on-asset-click on-component-click
             :on-assets-delete on-assets-delete
             :on-clear-selection on-clear-selection
+            :delete-component delete-component
             :count-variants count-variants}])
 
         (when ^boolean show-colors?