diff --git a/content/1.getting-started/3.writing/2.components.md b/content/1.getting-started/3.writing/2.components.md
index a6e9e8cb..ee66b987 100644
--- a/content/1.getting-started/3.writing/2.components.md
+++ b/content/1.getting-started/3.writing/2.components.md
@@ -370,18 +370,18 @@ The icon component uses **Nuxt Icon** under the hood. Check out the usage guide
     <div class="space-x-2">
 
     :icon{name="lucide:box"}
-    :icon{name="logos:javascript"}
-    :icon{name="logos:vue"}
-    :icon{name="logos:nuxt-icon" size="30"}
+    :icon{name="vscode-icons:file-type-js-official"}
+    :icon{name="vscode-icons:file-type-vue"}
+    :icon{name="vscode-icons:file-type-nuxt" size="30"}
 
     </div>
   ::
 
   ```mdc [Code]
   :icon{name="lucide:box"}
-  :icon{name="logos:javascript"}
-  :icon{name="logos:vue"}
-  :icon{name="logos:nuxt-icon" size="30"}
+  :icon{name="vscode-icons:file-type-js-official"}
+  :icon{name="vscode-icons:file-type-vue"}
+  :icon{name="vscode-icons:file-type-nuxt" size="30"}
   ```
 ::
 
@@ -734,7 +734,7 @@ The text `required` is configurable in [`main.fieldRequiredText`](/api/configura
     ---
     announcement:
       title: 'Release v1.0.0'
-      icon: 'noto:party-popper'
+      icon: 'lucide:party-popper'
       to: /getting-started
     actions:
       - name: Get Started
@@ -757,7 +757,7 @@ The text `required` is configurable in [`main.fieldRequiredText`](/api/configura
   ---
   announcement:
     title: 'Release v1.0.0'
-    icon: 'noto:party-popper'
+    icon: 'lucide:party-popper'
     to: /getting-started
   actions:
     - name: Get Started
diff --git a/content/index.md b/content/index.md
index ffda4747..b0707f5a 100644
--- a/content/index.md
+++ b/content/index.md
@@ -7,7 +7,7 @@ navigation: false
 ---
 announcement:
   title: 'Release v0.5.0'
-  icon: 'noto:party-popper'
+  icon: 'lucide:party-popper'
   to: /getting-started/changelog
 actions:
   - name: Get Started