diff --git a/src/Components/Footer.jsx b/src/Components/Footer.jsx
new file mode 100644
index 0000000..3f719eb
--- /dev/null
+++ b/src/Components/Footer.jsx
@@ -0,0 +1,16 @@
+import React from "react";
+import { Link } from "react-router-dom";
+import { FaGithub } from "react-icons/fa";
+
+const Footer = () => {
+  return (
+    <div className="h-16 flex justify-center items-center bg-custom-pink border-t-2 border-white">
+      <Link to="https://github.com/pooranjoyb/BeatBridge" className="mr-2">
+        <FaGithub size={24} />
+      </Link>
+      <div>&copy; 2023 BeatBridge</div>
+    </div>
+  );
+};
+
+export default Footer;
diff --git a/src/Components/Home.jsx b/src/Components/Home.jsx
index bd28094..07ff8d5 100644
--- a/src/Components/Home.jsx
+++ b/src/Components/Home.jsx
@@ -4,6 +4,7 @@ import Background from "/Background.png";
 import PageThree from "./PageThree";
 import Features from "./Features";
 import Navbar from "./Navbar";
+import Footer from "./Footer";
 
 export default function Home() {
   const animationControls = {
@@ -79,6 +80,7 @@ export default function Home() {
 
       <Features />
       <PageThree />
+      <Footer/>
     </>
   );
 }
diff --git a/tailwind.config.js b/tailwind.config.js
index fd23f53..0428e59 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -3,6 +3,9 @@ export default {
   content: ["./src/**/*.{html,js,jsx}"],
   theme: {
     extend: {
+      colors: {
+        "custom-pink": "#ff86c8",
+      },
       fontFamily: {
         josh: ["Jost", "sans"],
       },