diff --git a/demo/partials/navigation-shell.html b/demo/partials/navigation-shell.html
index 6e9ffdc..db9ffd9 100644
--- a/demo/partials/navigation-shell.html
+++ b/demo/partials/navigation-shell.html
@@ -37,10 +37,10 @@
   <div id="vue-navigation-shell-app" class="vue-mount"></div>
   <script type="module">
     import { createApp } from "vue";
-    import { GnNavigationShell, GnNavigationItem, GnIdentity, GnButton } from "/vue/index.js";
+    import { GnNavigationShell, GnNavigationItem, GnIdentity, GnIconButton } from "/vue/index.js";
 
     createApp({
-      components: { GnNavigationShell, GnNavigationItem, GnIdentity, GnButton },
+      components: { GnNavigationShell, GnNavigationItem, GnIdentity, GnIconButton },
       template: `
         <gn-navigation-shell brand="VMK App" style="min-height: 300px;">
           <template #menu>
@@ -56,8 +56,8 @@
                 :avatar="{ src: '/assets/avatar-placeholder.png', status: 'online', size: 'sm', variant: 'mint' }"
               />
             </a>
-            <gn-button variant="secondary" size="sm" icon="ph-pencil-simple" aria-label="Edit profile" />
-            <gn-button variant="secondary" size="sm" icon="ph-sign-out" aria-label="Logout" />
+            <gn-icon-button icon="ph-pencil-simple" label="Edit profile" variant="secondary" size="sm" />
+            <gn-icon-button icon="ph-sign-out" label="Logout" variant="secondary" size="sm" />
           </template>
           <template #default>
             <p>Main content inside the Vue navigation shell.</p>