diff --git a/components/Layout/CardsLayout.tsx b/components/Layout/CardsLayout.tsx
new file mode 100644
index 0000000..5f1a9a6
--- /dev/null
+++ b/components/Layout/CardsLayout.tsx
@@ -0,0 +1,15 @@
+import React from "react";
+
+interface CardsLayoutProps {
+  children: React.ReactNode;
+}
+
+const CardsLayout = ({ children }: CardsLayoutProps) => {
+  return (
+    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5 md:gap-6 lg:gap-[10px] w-full">
+      {children}
+    </div>
+  );
+};
+
+export default CardsLayout;
diff --git a/components/Layout/ContentLayout.tsx b/components/Layout/ContentLayout.tsx
new file mode 100644
index 0000000..e2eb3dc
--- /dev/null
+++ b/components/Layout/ContentLayout.tsx
@@ -0,0 +1,15 @@
+import React from "react";
+
+interface ContentLayoutProps {
+  children: React.ReactNode;
+}
+
+const ContentLayout = ({ children }: ContentLayoutProps) => {
+  return (
+    <div className="w-full max-w-[1125px] mx-auto p-[10px] md:p-10 px-[32.5px]">
+      {children}
+    </div>
+  );
+};
+
+export default ContentLayout;
diff --git a/pages/favorite/index.tsx b/pages/favorite/index.tsx
new file mode 100644
index 0000000..22af0e1
--- /dev/null
+++ b/pages/favorite/index.tsx
@@ -0,0 +1,27 @@
+import CardsLayout from "@/components/Layout/CardsLayout";
+import ContentLayout from "@/components/Layout/ContentLayout";
+
+const Favorite = () => {
+  return (
+    <>
+      <div className="page-title pt-[10px] md:pt-5 pb-10 md:pb-[60px] bg-gray100 text-center">
+        <h2 className="text-[32px] md:text-[40px] font-semibold">
+          ⭐️ 즐겨찾기
+        </h2>
+      </div>
+      <ContentLayout>
+        <CardsLayout>
+          {/* 카드 공통 컴포넌트로 구현 예정 */}
+          <div className="border border-red-800">card</div>
+          <div className="border border-red-800">card</div>
+          <div className="border border-red-800">card</div>
+          <div className="border border-red-800">card</div>
+          <div className="border border-red-800">card</div>
+          <div className="border border-red-800">card</div>
+        </CardsLayout>
+      </ContentLayout>
+    </>
+  );
+};
+
+export default Favorite;