diff --git a/frontend/src/app/layout.tsx b/frontend/src/app/layout.tsx
index 6d55e89..5d6b04a 100644
--- a/frontend/src/app/layout.tsx
+++ b/frontend/src/app/layout.tsx
@@ -2,8 +2,8 @@ import type { Metadata } from "next";
 import { Noto_Sans_Mono, Noto_Sans_TC } from "next/font/google";
 import localFont from "next/font/local";
 
-import Footer from "@/lib/common/presenter/ui/Footer";
-import Navbar from "@/lib/common/presenter/ui/Navbar";
+import Footer from "@/lib/common/framework/ui/Footer";
+import Navbar from "@/lib/common/framework/ui/Navbar";
 
 import "./globals.css";
 
diff --git a/frontend/src/lib/common/presenter/ui/Footer.tsx b/frontend/src/lib/common/framework/ui/Footer.tsx
similarity index 100%
rename from frontend/src/lib/common/presenter/ui/Footer.tsx
rename to frontend/src/lib/common/framework/ui/Footer.tsx
diff --git a/frontend/src/lib/common/presenter/ui/Navbar.tsx b/frontend/src/lib/common/framework/ui/Navbar.tsx
similarity index 72%
rename from frontend/src/lib/common/presenter/ui/Navbar.tsx
rename to frontend/src/lib/common/framework/ui/Navbar.tsx
index 0526124..e37b38a 100644
--- a/frontend/src/lib/common/presenter/ui/Navbar.tsx
+++ b/frontend/src/lib/common/framework/ui/Navbar.tsx
@@ -1,11 +1,13 @@
+import Image from "next/image";
 import Link from "next/link";
 
 export default function Navbar() {
   return (
     <div className="border-b border-gray-300">
       <div className="mx-auto flex h-[--tool-bar-height] max-w-screen-xl flex-row items-center justify-between px-4 md:px-6">
-        <Link className="text-2xl font-black text-gray-800" href="/">
-          魚之魷魂
+        <Link className="flex flex-row items-center gap-x-2" href="/">
+          <Image className="mt-1 size-10" src="/icon/logo-light.svg" alt="SquidSpirit" height={40} width={40} />
+          <span className="text-2xl font-black text-gray-800">魚之魷魂</span>
         </Link>
         <div className="flex flex-row items-center gap-x-6">
           <Action label="首頁" link="/" isSelected={true} />