diff --git a/src/App.jsx b/src/App.jsx
index a108a6454..ccb843126 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -1,13 +1,13 @@
 import { Navbar, Footer } from "./components";
-import { ProjectsPage, Home } from "./pages";
+import { ProjectsPage, HomePage } from "./pages";
 import { Route, Routes, Navigate } from "react-router-dom";
 
 function App() {
   return (
-    <div className="bg-secondary text-white">
+    <div className=" text-white">
       <Navbar />
       <Routes>
-        <Route exact path="/" element={<Home />} />
+        <Route exact path="/" element={<HomePage />} />
         <Route path="ProjectsPage" element={<ProjectsPage />} />
         <Route path="/*" element={<Navigate to={"/"} />} />
       </Routes>
diff --git a/src/pages/Home.jsx b/src/pages/HomePage.jsx
similarity index 97%
rename from src/pages/Home.jsx
rename to src/pages/HomePage.jsx
index 6f41ada92..6f34b7c1b 100644
--- a/src/pages/Home.jsx
+++ b/src/pages/HomePage.jsx
@@ -1,7 +1,7 @@
 import React from "react";
 import { Link } from "react-router-dom";
 
-const Home = () => {
+const HomePage = () => {
   return (
     <section>
       <div className="mx-auto max-w-screen-xl px-4 py-20 lg:flex my-28 lg:items-center ">
@@ -42,4 +42,4 @@ const Home = () => {
   );
 };
 
-export default Home;
+export default HomePage;
diff --git a/src/pages/index.js b/src/pages/index.js
index 7719a82c3..b4f59f332 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -1,4 +1,3 @@
 import ProjectsPage from "./ProjectsPage";
-import Home from "./Home";
-
-export { ProjectsPage, Home };
+import HomePage from "./HomePage";
+export { ProjectsPage, HomePage };