diff --git a/src/App.tsx b/src/App.tsx
index 22d5a39e..a6bb8d5b 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -29,8 +29,8 @@ const App = () => {
   const [loading, setLoading] = useState(true);
   const [searchParams] = useSearchParams();
 
-  const scrollToExplore = () => {
-    const exploreContent = document.getElementById("explore");
+  const scrollToFooter = () => {
+    const exploreContent = document.getElementById("footer");
     if (exploreContent) {
       exploreContent.scrollIntoView({ behavior: "smooth" });
     }
@@ -104,7 +104,7 @@ const App = () => {
   return (
     <AntdApp>
       <Layout style={{ minHeight: "100vh" }}>
-        <Navbar scrollToExplore={scrollToExplore} />
+        <Navbar scrollToFooter={scrollToFooter} />
         <Content>
           <Routes>
             <Route
@@ -118,7 +118,7 @@ const App = () => {
                     background: backgroundColor,
                   }}
                 >
-                  <Row id="explore">
+                  <Row>
                     <Col xs={24} sm={8}>
                       <Row
                         style={{
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 288aa054..77bc841a 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -22,6 +22,7 @@ const CustomFooter: React.FC = () => {
 
   return (
     <Footer
+      id="footer"
       style={{
         background: "#1b2540",
         color: "white",
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index e093c221..350f3cd9 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -13,7 +13,7 @@ import {
 
 const { useBreakpoint } = Grid;
 
-function Navbar({ scrollToExplore }: { scrollToExplore: any }) {
+function Navbar({ scrollToFooter }: { scrollToFooter: any }) {
   const [hovered, setHovered] = useState<
     null | "home" | "explore" | "help" | "github" | "join"
   >(null);
@@ -142,7 +142,7 @@ function Navbar({ scrollToExplore }: { scrollToExplore: any }) {
               ...menuItemStyle("explore", false),
               cursor: "pointer",
             }}
-            onClick={scrollToExplore}
+            onClick={scrollToFooter}
             onMouseEnter={() => setHovered("explore")}
             onMouseLeave={() => setHovered(null)}
           >
diff --git a/src/tests/components/Navbar.test.tsx b/src/tests/components/Navbar.test.tsx
index 0c236896..420c810d 100644
--- a/src/tests/components/Navbar.test.tsx
+++ b/src/tests/components/Navbar.test.tsx
@@ -6,7 +6,7 @@ import { MemoryRouter } from "react-router-dom";
 const renderNavbar = () => {
   render(
     <MemoryRouter>
-      <Navbar scrollToExplore={() => {}} />
+      <Navbar scrollToFooter={() => {}} />
     </MemoryRouter>
   );
 };