diff --git a/docs/guide/packages/lucide-svelte.md b/docs/guide/packages/lucide-svelte.md
index f92309c01..8012559a7 100644
--- a/docs/guide/packages/lucide-svelte.md
+++ b/docs/guide/packages/lucide-svelte.md
@@ -162,11 +162,13 @@ The package includes type definitions for all icons. This is useful if you want
 </script>
 
 {#each menuItems as item}
+  {@const Icon = item.icon}
   <a href={item.href}>
-    <svelte:component this={item.icon} />
+    <Icon />
     <span>{item.name}</span>
   </a>
 {/each}
+
 ```
 :::
 
@@ -246,8 +248,9 @@ The package includes type definitions for all icons. This is useful if you want
 </script>
 
 {#each menuItems as item}
+  {@const Icon = item.icon}
   <a href={item.href}>
-   <svelte:component this={item.icon} />
+    <Icon />
     <span>{item.name}</span>
   </a>
 {/each}