diff --git a/public/assets/Curve1.png b/public/assets/Curve1.png
new file mode 100644
index 0000000..e00f341
Binary files /dev/null and b/public/assets/Curve1.png differ
diff --git a/public/assets/Curve2.png b/public/assets/Curve2.png
new file mode 100644
index 0000000..b745420
Binary files /dev/null and b/public/assets/Curve2.png differ
diff --git a/public/assets/MemojiGroup.png b/public/assets/MemojiGroup.png
new file mode 100644
index 0000000..fa1c9f8
Binary files /dev/null and b/public/assets/MemojiGroup.png differ
diff --git a/public/assets/Rectangle 1.png b/public/assets/Rectangle 1.png
new file mode 100644
index 0000000..35238e8
Binary files /dev/null and b/public/assets/Rectangle 1.png differ
diff --git a/public/assets/Rectangle 2.png b/public/assets/Rectangle 2.png
new file mode 100644
index 0000000..05e5512
Binary files /dev/null and b/public/assets/Rectangle 2.png differ
diff --git a/public/assets/Rectangle 3.png b/public/assets/Rectangle 3.png
new file mode 100644
index 0000000..4e4d112
Binary files /dev/null and b/public/assets/Rectangle 3.png differ
diff --git a/public/assets/Rectangle 4.png b/public/assets/Rectangle 4.png
new file mode 100644
index 0000000..76e86b0
Binary files /dev/null and b/public/assets/Rectangle 4.png differ
diff --git a/public/assets/Switch.png b/public/assets/Switch.png
new file mode 100644
index 0000000..92aef0e
Binary files /dev/null and b/public/assets/Switch.png differ
diff --git a/public/assets/icons/facebook.png b/public/assets/icons/facebook.png
new file mode 100644
index 0000000..2bbfc27
Binary files /dev/null and b/public/assets/icons/facebook.png differ
diff --git a/public/assets/icons/facebook.svg b/public/assets/icons/facebook.svg
new file mode 100644
index 0000000..4d7df29
--- /dev/null
+++ b/public/assets/icons/facebook.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.98 16V9.804H13.06L13.3712 7.3896H10.9792V5.848C10.9792 5.1488 11.1736 4.672 12.1768 4.672H13.4552V2.512C12.8361 2.44611 12.2138 2.41407 11.5912 2.416C9.748 2.416 8.4864 3.5416 8.4864 5.608V7.3896H6.4V9.804H8.4856V16H0.8832C0.3952 16 0 15.6048 0 15.1168V0.8832C0 0.3952 0.3952 0 0.8832 0H15.1168C15.6048 0 16 0.3952 16 0.8832V15.1168C16 15.6048 15.6048 16 15.1168 16H10.98Z" fill="#361566"/>
+</svg>
diff --git a/public/assets/icons/instagram.svg b/public/assets/icons/instagram.svg
new file mode 100644
index 0000000..0ad5e90
--- /dev/null
+++ b/public/assets/icons/instagram.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.82237 0C9.72237 0.0024 10.1792 0.0072 10.5736 0.0184L10.7288 0.024C10.908 0.0304 11.0848 0.0384 11.2984 0.048C12.1496 0.0879999 12.7304 0.2224 13.24 0.42C13.768 0.6232 14.2128 0.8984 14.6576 1.3424C15.0645 1.74219 15.3793 2.22598 15.58 2.76C15.7776 3.2696 15.912 3.8504 15.952 4.7024C15.9616 4.9152 15.9696 5.092 15.976 5.272L15.9808 5.4272C15.9928 5.8208 15.9976 6.2776 15.9992 7.1776L16 7.7744V8.8224C16.0019 9.40592 15.9958 9.98945 15.9816 10.5728L15.9768 10.728C15.9704 10.908 15.9624 11.0848 15.9528 11.2976C15.9128 12.1496 15.7768 12.7296 15.58 13.24C15.3793 13.774 15.0645 14.2578 14.6576 14.6576C14.2578 15.0646 13.774 15.3793 13.24 15.58C12.7304 15.7776 12.1496 15.912 11.2984 15.952L10.7288 15.976L10.5736 15.9808C10.1792 15.992 9.72237 15.9976 8.82237 15.9992L8.22557 16H7.17837C6.59457 16.0021 6.01079 15.9959 5.42717 15.9816L5.27197 15.9768C5.08205 15.9696 4.89218 15.9613 4.70237 15.952C3.85117 15.912 3.27037 15.7776 2.75997 15.58C2.22623 15.3792 1.74272 15.0645 1.34317 14.6576C0.935923 14.2579 0.620854 13.7741 0.419967 13.24C0.222367 12.7304 0.0879667 12.1496 0.0479667 11.2976L0.0239667 10.728L0.0199668 10.5728C0.00521967 9.98945 -0.00144772 9.40593 -3.32437e-05 8.8224V7.1776C-0.00224756 6.59408 0.00361973 6.01056 0.0175668 5.4272L0.0231668 5.272C0.0295668 5.092 0.0375668 4.9152 0.0471668 4.7024C0.0871668 3.8504 0.221567 3.2704 0.419167 2.76C0.620522 2.22576 0.936145 1.74195 1.34397 1.3424C1.74329 0.935639 2.22652 0.620859 2.75997 0.42C3.27037 0.2224 3.85037 0.0879999 4.70237 0.048C4.91517 0.0384 5.09277 0.0304 5.27197 0.024L5.42717 0.0191999C6.01052 0.00498617 6.59404 -0.00114776 7.17757 0.000799942L8.82237 0ZM7.99997 4C6.9391 4 5.92168 4.42143 5.17154 5.17157C4.42139 5.92172 3.99997 6.93913 3.99997 8C3.99997 9.06087 4.42139 10.0783 5.17154 10.8284C5.92168 11.5786 6.9391 12 7.99997 12C9.06083 12 10.0782 11.5786 10.8284 10.8284C11.5785 10.0783 12 9.06087 12 8C12 6.93913 11.5785 5.92172 10.8284 5.17157C10.0782 4.42143 9.06083 4 7.99997 4ZM7.99997 5.6C8.31514 5.59995 8.62724 5.66197 8.91844 5.78254C9.20964 5.9031 9.47424 6.07984 9.69714 6.30266C9.92004 6.52548 10.0969 6.79003 10.2175 7.08119C10.3382 7.37235 10.4003 7.68443 10.4004 7.9996C10.4004 8.31477 10.3384 8.62687 10.2178 8.91807C10.0973 9.20927 9.92053 9.47388 9.69771 9.69677C9.47488 9.91967 9.21034 10.0965 8.91918 10.2172C8.62801 10.3378 8.31594 10.3999 8.00077 10.4C7.36425 10.4 6.7538 10.1471 6.30371 9.69706C5.85362 9.24697 5.60077 8.63652 5.60077 8C5.60077 7.36348 5.85362 6.75303 6.30371 6.30294C6.7538 5.85286 7.36425 5.6 8.00077 5.6M12.2008 2.8C11.9355 2.8 11.6812 2.90536 11.4937 3.09289C11.3061 3.28043 11.2008 3.53478 11.2008 3.8C11.2008 4.06522 11.3061 4.31957 11.4937 4.50711C11.6812 4.69464 11.9355 4.8 12.2008 4.8C12.466 4.8 12.7203 4.69464 12.9079 4.50711C13.0954 4.31957 13.2008 4.06522 13.2008 3.8C13.2008 3.53478 13.0954 3.28043 12.9079 3.09289C12.7203 2.90536 12.466 2.8 12.2008 2.8Z" fill="#361566"/>
+</svg>
diff --git a/public/assets/icons/telegram.svg b/public/assets/icons/telegram.svg
new file mode 100644
index 0000000..0902698
--- /dev/null
+++ b/public/assets/icons/telegram.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 0C3.584 0 0 3.584 0 8C0 12.416 3.584 16 8 16C12.416 16 16 12.416 16 8C16 3.584 12.416 0 8 0ZM11.712 5.44C11.592 6.704 11.072 9.776 10.808 11.192C10.696 11.792 10.472 11.992 10.264 12.016C9.8 12.056 9.448 11.712 9 11.416C8.296 10.952 7.896 10.664 7.216 10.216C6.424 9.696 6.936 9.408 7.392 8.944C7.512 8.824 9.56 6.96 9.6 6.792C9.60556 6.76655 9.60482 6.74014 9.59785 6.71504C9.59088 6.68995 9.57788 6.66693 9.56 6.648C9.512 6.608 9.448 6.624 9.392 6.632C9.32 6.648 8.2 7.392 6.016 8.864C5.696 9.08 5.408 9.192 5.152 9.184C4.864 9.176 4.32 9.024 3.912 8.888C3.408 8.728 3.016 8.64 3.048 8.36C3.064 8.216 3.264 8.072 3.64 7.92C5.976 6.904 7.528 6.232 8.304 5.912C10.528 4.984 10.984 4.824 11.288 4.824C11.352 4.824 11.504 4.84 11.6 4.92C11.68 4.984 11.704 5.072 11.712 5.136C11.704 5.184 11.72 5.328 11.712 5.44Z" fill="#361566"/>
+</svg>
diff --git a/public/assets/icons/x.svg b/public/assets/icons/x.svg
new file mode 100644
index 0000000..afc7c39
--- /dev/null
+++ b/public/assets/icons/x.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.6008 0.800293H15.0544L9.6944 6.90029L16 15.2003H11.0624L7.196 10.1659L2.7712 15.2003H0.3152L6.0488 8.67629L0 0.800293H5.0624L8.5584 5.40189L12.6008 0.800293ZM11.74 13.7379H13.1L4.3232 2.18589H2.864L11.74 13.7379Z" fill="#361566"/>
+</svg>
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
new file mode 100644
index 0000000..b021664
--- /dev/null
+++ b/src/components/Footer.tsx
@@ -0,0 +1,62 @@
+import React from "react";
+
+type Props = {};
+interface Icons {
+    href: string;
+    src: string;
+    alt: string;
+}
+
+const socialMediaLinks: Icons[] = [
+    {
+        href: "https://instagram.com/",
+        src: "/assets/icons/instagram.svg",
+        alt: "Instagram Logo",
+    },
+    {
+        href: "https://x.com/",
+        src: "/assets/icons/x.svg",
+        alt: "X(Twitter) Logo",
+    },
+    {
+        href: "https://facebook.com/",
+        src: "/assets/icons/facebook.svg",
+        alt: "Facebook Logo",
+    },
+    {
+        href: "https://t.me/",
+        src: "/assets/icons/telegram.svg",
+        alt: "telegram Logo",
+    },
+
+]
+
+const Footer = (props: Props) => {
+    return (
+        <section className="bg-neutral-white pt-20 p-8 sm:p-20">
+            <div className="flex justify-center mb-10 md:mb-20">
+                <img src="/assets/fusionTechLogo.svg" alt="Fusion Tech Logo" className="w-[800px] max-w-full" />
+            </div>
+            <div className="flex justify-between items-center flex-col-reverse sm:flex-row gap-6">
+                <div>
+                    <p className="text-primary font-helvetica-light font-[400] text-center hidden md:block">© 2024 GenZtechies X Codespace | All rights reserved.</p>
+                    <p className="text-primary font-helvetica-light font-[400] text-center md:hidden block">© 2024 GenZtechies X Codespace <span className="block sm:text-left"> All rights reserved.</span></p>
+                </div>
+                <div className="flex flex-col items-center sm:items-end gap-3">
+                    <ul className="flex gap-4 font-helvetica-compressed text-primary text-[18px]">
+                        <li><a href="">INITIATIVES</a></li>
+                        <li><a href="">DONATE</a></li>
+                        <li><a href="">GALLERY</a></li>
+                        <li><a href="">PRESS</a></li>
+                    </ul>
+                    <ul className="flex gap-2 justify-end">
+
+                        {socialMediaLinks.map((link, i) => (<li className="" key={i}><a href={link.href} className="block bg-secondary rounded-full p-[6.4px] border border-primary"><img src={link.src} alt={link.alt} className="w-4 h-4" /></a></li>))}
+                    </ul>
+                </div>
+            </div>
+        </section>
+    );
+};
+
+export default Footer;
diff --git a/src/components/Gallery.tsx b/src/components/Gallery.tsx
new file mode 100644
index 0000000..6924b7b
--- /dev/null
+++ b/src/components/Gallery.tsx
@@ -0,0 +1,11 @@
+import React from 'react'
+
+type Props = {}
+
+const Gallery = (props: Props) => {
+    return (
+        <section id='gallery'> Gallery</section>
+    )
+}
+
+export default Gallery
\ No newline at end of file
diff --git a/src/components/JoinCommunity.tsx b/src/components/JoinCommunity.tsx
new file mode 100644
index 0000000..ce4594d
--- /dev/null
+++ b/src/components/JoinCommunity.tsx
@@ -0,0 +1,58 @@
+import React from 'react'
+
+type Props = {}
+interface Icons {
+    href: string;
+    src: string;
+    alt: string;
+}
+
+const socialMediaLinks: Icons[] = [
+    {
+        href: "https://instagram.com/",
+        src: "/assets/icons/instagram.svg",
+        alt: "Instagram Logo",
+    },
+    {
+        href: "https://x.com/",
+        src: "/assets/icons/x.svg",
+        alt: "X(Twitter) Logo",
+    },
+    {
+        href: "https://facebook.com/",
+        src: "/assets/icons/facebook.svg",
+        alt: "Facebook Logo",
+    },
+    {
+        href: "https://t.me/",
+        src: "/assets/icons/telegram.svg",
+        alt: "telegram Logo",
+    },
+
+]
+
+
+const JoinCommunity = (props: Props) => {
+    return (
+        <section className='bg-neutral-white p-8 sm:p-20 bg-[url("/assets/Switch.png")]'>
+            <div className="bg-primary rounded-lg px-5 py-16 font-helvetica-compressed flex flex-col lg:flex-row gap-4 md:gap-3">
+                <div className='flex flex-col gap-3 lg:w-[60%]'>
+                    <div className="font-[500] "><h2 className="text-white text-4xl md:text-7xl">JOIN THE<span className="text-[#F4B0E9]"> COMMUNITY</span> AND<span className="text-[#F4B0E9]"> NETWORK </span>WITH LIKE MINDS</h2></div>
+                    <div className="justify-between w-[16rem] md:w-[20rem] rounded-[30px] px-[12px] py-[8px] bg-[rgba(255,255,255,0.3)] flex items-center gap-2">
+                        <p className="text-[#f4b0e9] md:text-[18px] whitespace-nowrap">Join Community</p>
+                        <ul className='flex space-x-1'>
+                            {socialMediaLinks.map((link, i) => (
+                                <li key={i} className="inline">
+                                    <a href={link.href} className="bg-[#f4b0e9] block rounded-full p-[6.4px] border border-primary">
+                                        <img src={link.src} alt={link.alt} className="w-4 h-4" />
+                                    </a>
+                                </li>))}
+                        </ul>
+                    </div>
+
+                </div>
+                <div className='md:wd1/2 '><img src="/assets/MemojiGroup.png" alt="Memoji Group" className="w-[648px] max-w-full" /></div></div>
+        </section>)
+}
+
+export default JoinCommunity
\ No newline at end of file
diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index 623bf6b..ab30ecb 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -3,6 +3,9 @@ import Header from "../components/Header";
 import Hero from "../components/Hero";
 import Sponsor from "../components/Sponsor";
 import About from "../components/About";
+import Gallery from "../components/Gallery";
+import Footer from "../components/Footer";
+import JoinCommunity from "../components/JoinCommunity";
 
 type Props = {};
 
@@ -13,6 +16,10 @@ const Home = (props: Props) => {
             <Hero />
             <Sponsor />
             <About />
+
+            <Gallery />
+            <JoinCommunity />
+            <Footer />
         </div>
     );
 };