diff --git a/web/frontend/src/header/NavbarLinks.svelte b/web/frontend/src/header/NavbarLinks.svelte
index 26e7370..50aaf3a 100644
--- a/web/frontend/src/header/NavbarLinks.svelte
+++ b/web/frontend/src/header/NavbarLinks.svelte
@@ -18,10 +18,13 @@
     DropdownItem,
   } from "@sveltestrap/sveltestrap";
 
-  export let clusters;
-  export let subClusters;
-  export let links;
-  export let direction = "down";
+  /* Svelte 5 Props */
+  let {
+    clusters,
+    subClusters,
+    links,
+    direction = "down"
+  } = $props();
 </script>
 
 {#each links as item}
diff --git a/web/frontend/src/header/NavbarTools.svelte b/web/frontend/src/header/NavbarTools.svelte
index 1382b28..ac0a261 100644
--- a/web/frontend/src/header/NavbarTools.svelte
+++ b/web/frontend/src/header/NavbarTools.svelte
@@ -25,10 +25,13 @@
     Col,
   } from "@sveltestrap/sveltestrap";
 
-  export let username;
-  export let authlevel;
-  export let roles;
-  export let screenSize;
+  /* Svelte 5 Props */
+  let {
+    username,
+    authlevel,
+    roles,
+    screenSize
+  } = $props();
 </script>
 
 <Nav navbar>
@@ -91,7 +94,7 @@
     <NavItem>
       <Button
         outline
-        on:click={() => (window.location.href = "/config")}
+        onclick={() => (window.location.href = "/config")}
         style="margin-left: 10px;"
         title="Settings"
       >
@@ -136,7 +139,7 @@
           <Col xs="4">
             <Button
               outline
-              on:click={() => (window.location.href = "/config")}
+              onclick={() => (window.location.href = "/config")}
               size="sm"
               class="my-2 w-100"
             >