diff --git a/src/App.js b/src/App.js
index c13cb74..6f542c2 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,4 +1,6 @@
 
+import './styles/LandingPage.css'
+
 import React, { useContext, useEffect } from 'react';
 import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
 import axios from 'axios';
@@ -47,27 +49,29 @@ function App() {
   }
 
   return (
+      <div>
+        <LandingPage />
 
-    <BrowserRouter>
-      <div className="App">
-        <Routes>
-          <Route path="/" element={<LandingPage />} />
-          <Route path="/login" element={<LoginPage />} />
-          <Route path="/register" element={<RegisterPage />} />
-          <Route path="/home" element={<HomePage />} />
-          {/* Add the following route with the authentication check */}
-          <Route
-            path="/createNew"
-            element=<CreateBlogPage />
-          />
-          <Route path="/created" element={<CreatedBlogPage />} />
-          <Route path="/profile" element={<ProfilePage />} />
-          <Route path="/blogs/:id" element={<BlogsDetailPage />} />
-        </Routes>
-        <Toaster />
+        <BrowserRouter>
+          <div className="App">
+            <Routes>
+              <Route path="/" element={<LandingPage />} />
+              <Route path="/login" element={<LoginPage />} />
+              <Route path="/register" element={<RegisterPage />} />
+              <Route path="/home" element={<HomePage />} />
+              {/* Add the following route with the authentication check */}
+              <Route
+                path="/createNew"
+                element= <CreateBlogPage />
+              />
+              <Route path="/created" element={<CreatedBlogPage />} />
+              <Route path="/profile" element={<ProfilePage />} />
+              <Route path="/blogs/:id" element={<BlogsDetailPage />} />
+            </Routes>
+            <Toaster />
+          </div>
+        </BrowserRouter>
       </div>
-    </BrowserRouter>
-
   );
 }
 
diff --git a/src/assets/logo.png b/src/assets/logo.png
new file mode 100644
index 0000000..56bd13f
Binary files /dev/null and b/src/assets/logo.png differ
diff --git a/src/components/LandingPage.js b/src/components/LandingPage.js
index 314556a..0f20e03 100644
--- a/src/components/LandingPage.js
+++ b/src/components/LandingPage.js
@@ -4,6 +4,10 @@ import { MDBBtn } from 'mdb-react-ui-kit';
 function LandingPage() {
   return (
     <div className="downPage">
+      <header className="lp_header">
+        <div className="header_logo"></div>
+        <h3>IEEEBlogs</h3>
+      </header>
     <nav className="lp_navbar">
         {/* <img src={logo} alt="logo" className="logo" /> */}
         <div className="lp_buttons">
@@ -21,6 +25,10 @@ function LandingPage() {
       </div>
       <footer className="lp_footer">
         &copy; 2023 Career Development Website
+        <div className="links">
+          <a href="https://www.youtube.com/watch?v=oHg5SJYRHA0">Youtube</a>
+          <a href="https://github.com/IEEE-BlogApp/frontend">Github</a>
+        </div>
       </footer>
     </div>
   );
diff --git a/src/index.css b/src/index.css
index aac2572..821a14b 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,4 +1,4 @@
-/* <<<<<<< HEAD */
+
 body {
     font-family: Roboto, Helvetica, Arial, sans-serif;
   }
@@ -26,6 +26,9 @@ body {
   position: fixed;
 }
 
+
+
+
  */
 
 
diff --git a/src/styles/LandingPage.css b/src/styles/LandingPage.css
index 5e25d88..42b5496 100644
--- a/src/styles/LandingPage.css
+++ b/src/styles/LandingPage.css
@@ -54,15 +54,49 @@
   }
 
   .lp_footer {
-    background-color: black;
+    background-color: rgb(12, 12, 12);
     color: white;
     padding: 1rem;
-    text-align: center;
     position: absolute;
     bottom: 0;
     width: 100%;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
   }
 
   .lp_a{
     color:white;
-  }
\ No newline at end of file
+  }
+
+.lp_header {
+  background-color: rgb(12, 12, 12);
+  color: white;
+  padding: 1rem;
+  position: absolute;
+  top: 0;
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  
+}
+
+.lp_header > .header_logo {
+  background-image: url("../assets/logo.png");
+  background-size:cover;
+  padding: 1.5rem;
+  margin-top: -10px;
+  margin-left: -10px;
+}
+
+.lp_header > h3 {
+  margin-left: 30px;
+}
+
+.links > a {
+  margin-left: 40px;
+  margin-right: 20px;
+}
+
+
+