diff --git a/app/component/Navbar.tsx b/app/component/Navbar.tsx
new file mode 100644
index 0000000..960b50e
--- /dev/null
+++ b/app/component/Navbar.tsx
@@ -0,0 +1,26 @@
+import React from "react";
+
+export default function Navbar() {
+  return (
+    <div className="flex bg-white w-full items-center justify-between box-border h-[100px] px-[130px]">
+      {/* Logo Placeholder */}
+      <div className="bg-[#d9d9d9] h-[36px] w-[150px]" />
+
+      {/* Right Menu */}
+      <div className="flex items-center gap-[30px]">
+        {/* 찜한 목록 */}
+        <button className="font-semibold text-[#434343] leading-[1.1] text-[16px]">
+          찜한 목록
+        </button>
+
+        {/* Divider */}
+        <div className="bg-[#d9d9d9] h-[22px] w-[1px]" />
+
+        {/* Log in / Sign in */}
+        <button className="font-semibold text-[#434343] leading-[1.1] uppercase text-[16px]">
+          Log in / Sign in
+        </button>
+      </div>
+    </div>
+  );
+}
diff --git a/app/page.tsx b/app/page.tsx
index d5d0df7..b900b5e 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,9 +1,10 @@
 import SeoulMap from "./component/SeoulMap";
+import Navbar from "./component/Navbar";
 
 export default function Home() {
   return (
-    <div className="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black">
-      <p className="font-bold text-white">Test</p>
-    </div>
+    <main className="flex min-h-screen flex-col bg-zinc-50 font-sans dark:bg-black">
+      <Navbar />
+    </main>
   );
 }