diff --git a/src/App.tsx b/src/App.tsx
index 0bd2396..666c3aa 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,11 +1,16 @@
+import LandingLayout from "@/layouts/LandingLayout";
 import Home from "@/pages/home/Home";
+import Landing from "@/pages/landing/Landing";
 import { Route, Routes } from "react-router";
 
 function App() {
   return (
     <>
       <Routes>
-        <Route index element={<Home />} />
+        {/* <Route index element={<Home />} /> */}
+        <Route path="/" element={<LandingLayout />}>
+          <Route index element={<Landing />} />
+        </Route>
       </Routes>
     </>
   );
diff --git a/src/assets/icons/ellipsisButton.svg b/src/assets/icons/ellipsisButton.svg
new file mode 100644
index 0000000..f508ee3
--- /dev/null
+++ b/src/assets/icons/ellipsisButton.svg
@@ -0,0 +1,5 @@
+<svg width="18" height="4" viewBox="0 0 18 4" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9 3C9.55228 3 10 2.55228 10 2C10 1.44772 9.55228 1 9 1C8.44772 1 8 1.44772 8 2C8 2.55228 8.44772 3 9 3Z" stroke="#6C6C6C" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16 3C16.5523 3 17 2.55228 17 2C17 1.44772 16.5523 1 16 1C15.4477 1 15 1.44772 15 2C15 2.55228 15.4477 3 16 3Z" stroke="#6C6C6C" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M2 3C2.55228 3 3 2.55228 3 2C3 1.44772 2.55228 1 2 1C1.44772 1 1 1.44772 1 2C1 2.55228 1.44772 3 2 3Z" stroke="#6C6C6C" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/src/assets/icons/icons.svg b/src/assets/icons/icons.svg
deleted file mode 100644
index e69de29..0000000
diff --git a/src/assets/icons/logo.png b/src/assets/icons/logo.png
new file mode 100644
index 0000000..653f98d
Binary files /dev/null and b/src/assets/icons/logo.png differ
diff --git a/src/assets/icons/notification.svg b/src/assets/icons/notification.svg
new file mode 100644
index 0000000..08ba801
--- /dev/null
+++ b/src/assets/icons/notification.svg
@@ -0,0 +1,3 @@
+<svg width="13" height="15" viewBox="0 0 13 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.87462 0.800783C6.62499 0.800783 6.41993 0.882814 6.25945 1.04688C6.09896 1.21095 6.01872 1.42058 6.01872 1.67578V2.19528C5.02018 2.41408 4.20886 2.91538 3.58477 3.69918C2.94285 4.48306 2.61297 5.41276 2.59514 6.48828V7.00781C2.57731 8.32031 2.14937 9.47786 1.3113 10.4805L1.09733 10.7266C0.865523 11 0.820945 11.3099 0.963594 11.6563C1.12407 11.9844 1.38263 12.1576 1.73925 12.1758H12.01C12.3666 12.1576 12.6251 11.9844 12.7857 11.6563C12.9283 11.3099 12.8837 11 12.6519 10.7266L12.4647 10.4805C11.6088 9.4961 11.1719 8.33854 11.1541 7.00781V6.48828C11.1363 5.41276 10.8064 4.48306 10.1645 3.69918C9.54038 2.91538 8.72906 2.41408 7.73051 2.19528V1.67578C7.73051 1.42058 7.65027 1.21095 7.48979 1.04688C7.32931 0.882814 7.12425 0.800783 6.87462 0.800783ZM8.07822 14.2812C8.41701 13.9349 8.58641 13.5247 8.58641 13.0508H6.87462H5.16283C5.16283 13.5247 5.33223 13.9349 5.67102 14.2812C6.00981 14.6276 6.41101 14.8008 6.87462 14.8008C7.33823 14.8008 7.73943 14.6276 8.07822 14.2812Z" fill="#6C6C6C"/>
+</svg>
diff --git a/src/layouts/Header.tsx b/src/layouts/Header.tsx
index e69de29..af6aa1b 100644
--- a/src/layouts/Header.tsx
+++ b/src/layouts/Header.tsx
@@ -0,0 +1,38 @@
+import logo from "@assets/icons/logo.png";
+import notificationIcon from "@assets/icons/notification.svg";
+import ellipsisButton from "@/assets/icons/ellipsisButton.svg";
+import { Link } from "react-router";
+
+interface HeaderProps {
+  showNotification?: boolean; // 알림 아이콘을 표시할지 여부
+  showMoreOptions?: boolean; // 더보기 메뉴를 표시할지 여부
+}
+
+function Header({ showNotification, showMoreOptions }: HeaderProps) {
+  console.log(showNotification);
+  return (
+    <header className="h-[44px] bg-[#FBF5FF]/90 backdrop-blur-sm px-3 flex items-center justify-between">
+      <Link to="/">
+        <img src={logo} alt="logo" />
+      </Link>
+
+      {/* 알림 아이콘, 더보기 메뉴 아이콘 표시 */}
+      <div className="flex gap-1">
+        {/* 알림 */}
+        {showNotification && (
+          <div className="px-2 py-3 flex justify-center items-center">
+            <img src={notificationIcon} alt="알림" />
+          </div>
+        )}
+        {/* 더보기 메뉴 */}
+        {showMoreOptions && (
+          <div className="px-2 py-3 flex justify-center items-center">
+            <img src={ellipsisButton} alt="더보기" />
+          </div>
+        )}
+      </div>
+    </header>
+  );
+}
+
+export default Header;
diff --git a/src/layouts/LandingLayout.tsx b/src/layouts/LandingLayout.tsx
new file mode 100644
index 0000000..0757647
--- /dev/null
+++ b/src/layouts/LandingLayout.tsx
@@ -0,0 +1,15 @@
+import Header from "@/layouts/Header";
+import { Outlet } from "react-router";
+
+function LandingLayout() {
+  return (
+    <div className="max-w-[700px] w-full h-screen mx-auto flex flex-col border border-red-500">
+      <Header showNotification showMoreOptions />
+      <div className="flex-1 border border-blue-500">
+        <Outlet />
+      </div>
+    </div>
+  );
+}
+
+export default LandingLayout;
diff --git a/src/pages/home/Home.tsx b/src/pages/home/Home.tsx
index 0b6c7c6..35f305a 100644
--- a/src/pages/home/Home.tsx
+++ b/src/pages/home/Home.tsx
@@ -1,4 +1,3 @@
-
 import { twMerge } from "tailwind-merge";
 
 function Home() {
diff --git a/src/pages/landing/Landing.tsx b/src/pages/landing/Landing.tsx
new file mode 100644
index 0000000..61bb8c7
--- /dev/null
+++ b/src/pages/landing/Landing.tsx
@@ -0,0 +1,5 @@
+function Landing() {
+  return <div>렌딩페이지</div>;
+}
+
+export default Landing;