diff --git a/app/components/footer.tsx b/app/components/footer.tsx
new file mode 100644
index 0000000..38e9f8d
--- /dev/null
+++ b/app/components/footer.tsx
@@ -0,0 +1,29 @@
+import { Separator, Surface, Typography } from "@heroui/react";
+import { Link } from "@heroui/react";
+
+export function Footer() {
+    const date = new Date();
+    return (
+        <Surface className="flex p-4 justify-between" variant="default">
+            <Typography.Paragraph>
+                Copyright © {date.getFullYear()} Porning. All rights reserved.
+            </Typography.Paragraph>
+            <div className="flex gap-2">
+                <Link href="/contact">
+                    Contact Us
+                    <Link.Icon className="ml-1.5 size-3"></Link.Icon>
+                </Link>
+                <Separator orientation="vertical" variant="tertiary" />
+                <Link href="/legal/privacy">
+                    Privacy Policy
+                    <Link.Icon className="ml-1.5 size-3"></Link.Icon>
+                </Link>
+                <Separator orientation="vertical" variant="tertiary" />
+                <Link href="/legal/terms">
+                    Terms of Use
+                    <Link.Icon className="ml-1.5 size-3"></Link.Icon>
+                </Link>
+            </div>
+        </Surface>
+    );
+}
diff --git a/app/pages/home.tsx b/app/pages/home.tsx
index 2203e7d..d83aae2 100644
--- a/app/pages/home.tsx
+++ b/app/pages/home.tsx
@@ -5,6 +5,7 @@ import background from "../images/background.jpg";
 import skins from "../images/skins.jpg";
 import maps from "../images/maps.jpg";
 import gamemodes from "../images/gamemodes.webp";
+import { Footer } from "~/components/footer";
 
 export function HomePage() {
     return (
@@ -98,6 +99,7 @@ export function HomePage() {
                 </Surface>
             </div>
             <Header />
+            <Footer />
         </main>
     );
 }