diff --git a/app/components/Recent_Creation.tsx b/app/components/Recent_Creation.tsx
index 0d94bbd..f75a346 100644
--- a/app/components/Recent_Creation.tsx
+++ b/app/components/Recent_Creation.tsx
@@ -11,7 +11,7 @@ const Recent_Creation = () => {
         <h3 className="text-[16px] font-[700]">Recent creations</h3>
         <FaSlidersH className="text-[20px] recent_icon" />
       </div>
-      <div className="grid sm:grid-cols-6 md:grid-cols-5 gap-5 mt-2">
+      <div className="grid sm:grid-cols-2 md:grid-cols-5 gap-4 mt-2">
         <Recent_Card
           image={"/assets/aa31529b95af9b43380b88b11692b0a6f7999878.png"}
           title={"Good morning Gabe Hager!"}
diff --git a/app/creator/layout.tsx b/app/creator/layout.tsx
index 51d1209..71698a3 100644
--- a/app/creator/layout.tsx
+++ b/app/creator/layout.tsx
@@ -8,7 +8,7 @@ export default function CreatorLayout({
 }>) {
   return (
     <html lang="en">
-      <div className="flex min-h-screen">
+      <div className="flex ">
         <div className="fixed left-0 top-0 h-screen">
           <SideNav />
         </div>
diff --git a/app/creator/page.tsx b/app/creator/page.tsx
index 2a183f6..8b88972 100644
--- a/app/creator/page.tsx
+++ b/app/creator/page.tsx
@@ -1,7 +1,11 @@
+import { Home_Banner } from "../components/Home_Banner";
+import Recent_Creation from "../components/Recent_Creation";
+
 export default function CreatorPage() {
     return (
-        <div className="text-black">
-            <h1>Creator</h1>
-        </div>
+    <div className="w-full h-[80vh] flex flex-col bg-[#F3F3F3]">
+      <Home_Banner />
+      <Recent_Creation />
+    </div>
     )
 }
\ No newline at end of file
diff --git a/app/globals.css b/app/globals.css
index 8ba6bc7..eee99c3 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -172,7 +172,7 @@
   background-position: center center;
   background-blend-mode: multiply;
   height: 170px;
-  width: 1045px;
+  width: 100%;
   border-radius: 10px;
   padding: 8px;
   display: flex;
@@ -255,14 +255,14 @@
 .recent_container {
   display: flex;
   flex-direction: column;
-  gap: 10px;
-  width: 1047px;
+  width: 100%;
   height: 237px;
   margin-top: 30px;
 }
 
 .recent_title {
   display: flex;
+  width: 100%;
   justify-content: space-between;
   align-items: center;
 }
@@ -276,7 +276,7 @@
 }
 
 .recent_card {
-  width: 191px;
+  width: 100%;
   height: 150px;
   background-color: #ffffff;
   border-radius: 10px;
diff --git a/app/page.tsx b/app/page.tsx
index 582d677..9e33e8c 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,11 +1,11 @@
-import { Home_Banner } from "./components/Home_Banner";
-import Recent_Creation from "./components/Recent_Creation";
+
 
 export default function Home() {
   return (
     <div className="w-[100%] h-[96vh] px-4 flex flex-col items-center justify-center" style={{ backgroundColor: "#F2F4F8" }}>
-      <Home_Banner />
-      <Recent_Creation />
+      <div>
+        Home Page
+      </div>
     </div>
   );
 }
diff --git a/package.json b/package.json
index 375e0bb..b6d95b7 100644
--- a/package.json
+++ b/package.json
@@ -17,7 +17,7 @@
     "clsx": "^2.1.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "tailwind-merge": "^3.2.0"
+    "tailwind-merge": "^3.2.0",
     "react-icons": "^5.5.0"
   },
   "devDependencies": {
