diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index 41f6647..6c08c72 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -30,6 +30,7 @@
                 "@graphql-codegen/cli": "^5.0.0",
                 "@graphql-codegen/client-preset": "^4.1.0",
                 "@graphql-typed-document-node/core": "^3.2.0",
+                "@iconify/react": "^4.1.1",
                 "@types/node": "^20",
                 "@types/react": "^18",
                 "@types/react-dom": "^18",
@@ -3137,6 +3138,27 @@
             "integrity": "sha512-6EwiSjwWYP7pTckG6I5eyFANjPhmPjUX9JRLUSfNPC7FX7zK9gyZAfUEaECL6ALTpGX5AjnBq3C9XmVWPitNpw==",
             "dev": true
         },
+        "node_modules/@iconify/react": {
+            "version": "4.1.1",
+            "resolved": "https://registry.npmjs.org/@iconify/react/-/react-4.1.1.tgz",
+            "integrity": "sha512-jed14EjvKjee8mc0eoscGxlg7mSQRkwQG3iX3cPBCO7UlOjz0DtlvTqxqEcHUJGh+z1VJ31Yhu5B9PxfO0zbdg==",
+            "dev": true,
+            "dependencies": {
+                "@iconify/types": "^2.0.0"
+            },
+            "funding": {
+                "url": "https://github.com/sponsors/cyberalien"
+            },
+            "peerDependencies": {
+                "react": ">=16"
+            }
+        },
+        "node_modules/@iconify/types": {
+            "version": "2.0.0",
+            "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+            "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==",
+            "dev": true
+        },
         "node_modules/@isaacs/cliui": {
             "version": "8.0.2",
             "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
diff --git a/frontend/package.json b/frontend/package.json
index 233cc46..cfc5ab6 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -35,6 +35,7 @@
         "@graphql-codegen/cli": "^5.0.0",
         "@graphql-codegen/client-preset": "^4.1.0",
         "@graphql-typed-document-node/core": "^3.2.0",
+        "@iconify/react": "^4.1.1",
         "@types/node": "^20",
         "@types/react": "^18",
         "@types/react-dom": "^18",
diff --git a/frontend/src/app/page.tsx b/frontend/src/app/page.tsx
index d2e683f..2e06cdb 100644
--- a/frontend/src/app/page.tsx
+++ b/frontend/src/app/page.tsx
@@ -1,3 +1,7 @@
 export default function Home() {
-    return <main>Home</main>;
+    return (
+        <main>
+            <h1>Home</h1>
+        </main>
+    );
 }
diff --git a/frontend/src/components/Navbar.tsx b/frontend/src/components/Navbar.tsx
index 78d6463..ec6f0af 100644
--- a/frontend/src/components/Navbar.tsx
+++ b/frontend/src/components/Navbar.tsx
@@ -9,6 +9,7 @@ import {
     DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { useTheme } from "next-themes";
+import { Icon } from "@iconify/react";
 
 export default function Navbar() {
     const dropdownPaths = [
@@ -35,7 +36,10 @@ export default function Navbar() {
         <nav className="flex items-center justify-between p-4 bg-slate-700 dark:bg-slate-500 text-white w-full">
             <div>
                 <Link href="/">
-                    <Button variant={getButtonVariant("/")}>Logo</Button>
+                    <Button variant={getButtonVariant("/")}>
+                        Logo
+                        <Icon icon="mdi-light:home" className="size-10 ml-6" />
+                    </Button>
                 </Link>
             </div>