diff --git a/package.json b/package.json
index 22a3f19..fe70d37 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "@vitejs/plugin-react": "^2.2.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-icons": "^4.7.1",
     "react-router-dom": "^6.4.3",
     "vite": "^3.2.3"
   },
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 5e1c6ce..6cca405 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -17,6 +17,7 @@ specifiers:
   prettier: ^2.7.1
   react: ^18.2.0
   react-dom: ^18.2.0
+  react-icons: ^4.7.1
   react-router-dom: ^6.4.3
   sass: ^1.56.1
   simple-git-hooks: ^2.8.1
@@ -26,6 +27,7 @@ dependencies:
   '@vitejs/plugin-react': 2.2.0_vite@3.2.4
   react: 18.2.0
   react-dom: 18.2.0_react@18.2.0
+  react-icons: 4.7.1_react@18.2.0
   react-router-dom: 6.4.3_biqbaboplfbrettd7655fr4n2y
   vite: 3.2.4_sass@1.56.1
 
@@ -2242,6 +2244,14 @@ packages:
       scheduler: 0.23.0
     dev: false
 
+  /react-icons/4.7.1_react@18.2.0:
+    resolution: {integrity: sha512-yHd3oKGMgm7zxo3EA7H2n7vxSoiGmHk5t6Ou4bXsfcgWyhfDKMpyKfhHR6Bjnn63c+YXBLBPUql9H4wPJM6sXw==}
+    peerDependencies:
+      react: '*'
+    dependencies:
+      react: 18.2.0
+    dev: false
+
   /react-is/16.13.1:
     resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==}
     dev: true
diff --git a/public/fonts/gilroy/Gilroy-Black.ttf b/public/fonts/gilroy/Gilroy-Black.ttf
new file mode 100644
index 0000000..3e1a57e
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-Black.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-BlackItalic.ttf b/public/fonts/gilroy/Gilroy-BlackItalic.ttf
new file mode 100644
index 0000000..6f0b4c4
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-BlackItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-Bold.ttf b/public/fonts/gilroy/Gilroy-Bold.ttf
new file mode 100644
index 0000000..1aea716
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-Bold.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-BoldItalic.ttf b/public/fonts/gilroy/Gilroy-BoldItalic.ttf
new file mode 100644
index 0000000..6754019
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-BoldItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-ExtraBold.ttf b/public/fonts/gilroy/Gilroy-ExtraBold.ttf
new file mode 100644
index 0000000..01eb343
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-ExtraBold.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-ExtraBoldItalic.ttf b/public/fonts/gilroy/Gilroy-ExtraBoldItalic.ttf
new file mode 100644
index 0000000..86000c1
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-ExtraBoldItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-Heavy.ttf b/public/fonts/gilroy/Gilroy-Heavy.ttf
new file mode 100644
index 0000000..726e371
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-Heavy.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-HeavyItalic.ttf b/public/fonts/gilroy/Gilroy-HeavyItalic.ttf
new file mode 100644
index 0000000..12a7e55
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-HeavyItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-Light.ttf b/public/fonts/gilroy/Gilroy-Light.ttf
new file mode 100644
index 0000000..b08db4e
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-Light.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-LightItalic.ttf b/public/fonts/gilroy/Gilroy-LightItalic.ttf
new file mode 100644
index 0000000..ea4bee4
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-LightItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-Medium.ttf b/public/fonts/gilroy/Gilroy-Medium.ttf
new file mode 100644
index 0000000..06d6a94
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-Medium.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-MediumItalic.ttf b/public/fonts/gilroy/Gilroy-MediumItalic.ttf
new file mode 100644
index 0000000..9fbb898
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-MediumItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-Regular.ttf b/public/fonts/gilroy/Gilroy-Regular.ttf
new file mode 100644
index 0000000..ad17f71
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-Regular.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-RegularItalic.ttf b/public/fonts/gilroy/Gilroy-RegularItalic.ttf
new file mode 100644
index 0000000..628a732
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-RegularItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-SemiBold.ttf b/public/fonts/gilroy/Gilroy-SemiBold.ttf
new file mode 100644
index 0000000..cb3cbb6
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-SemiBold.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-SemiBoldItalic.ttf b/public/fonts/gilroy/Gilroy-SemiBoldItalic.ttf
new file mode 100644
index 0000000..fc82a10
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-SemiBoldItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-Thin.ttf b/public/fonts/gilroy/Gilroy-Thin.ttf
new file mode 100644
index 0000000..c6daeb7
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-Thin.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-ThinItalic.ttf b/public/fonts/gilroy/Gilroy-ThinItalic.ttf
new file mode 100644
index 0000000..4bc3561
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-ThinItalic.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-UltraLight.ttf b/public/fonts/gilroy/Gilroy-UltraLight.ttf
new file mode 100644
index 0000000..adc3e33
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-UltraLight.ttf differ
diff --git a/public/fonts/gilroy/Gilroy-UltraLightItalic.ttf b/public/fonts/gilroy/Gilroy-UltraLightItalic.ttf
new file mode 100644
index 0000000..3403fe8
Binary files /dev/null and b/public/fonts/gilroy/Gilroy-UltraLightItalic.ttf differ
diff --git a/src/App.jsx b/src/App.jsx
index 36c4538..6c21cd5 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -2,15 +2,19 @@ import { Routes, Route } from "react-router-dom";
 
 import { Home } from "./Pages";
 
-import { Navbar } from "./Components";
+import { Navbar,Button,Footer } from "./Components";
+
 
 const App = () => {
   return (
     <>
+
       <Navbar />
       <Routes>
         <Route path="/" element={<Home />} />
       </Routes>
+      <Footer/>
+  
     </>
   );
 };
diff --git a/src/Components/Footer/Footer.jsx b/src/Components/Footer/Footer.jsx
new file mode 100644
index 0000000..cddbc39
--- /dev/null
+++ b/src/Components/Footer/Footer.jsx
@@ -0,0 +1,39 @@
+import styles from "./Footer.module.scss";
+import React from "react";
+import {FiFacebook, FiLinkedin} from "react-icons/fi"
+import {AiOutlineInstagram} from "react-icons/ai"
+
+
+
+const Footer = () =>{
+    return(
+        <>
+
+
+         <div className={styles.containerContact}>
+            <p className={styles.contactHeader}>Contact<span className={styles.infoGrad}> Info</span></p>
+            <div className={styles.credInfo}>
+                <p className={styles.credItems}>Address<span className={styles.credText}>National Institute of Technology Silchar Cachar, Assam</span></p>
+                <p className={styles.credItems}>Website<span className={styles.credText}>www.nits.ac.in</span></p>
+                <p className={styles.credItems}>Email<span className={styles.credText}>xxxx@xxx.com</span></p>
+                <p className={styles.credItems}>Phone Number<span className={styles.credText}>+91-xxxxxxxxxx</span></p>
+            </div>
+
+        </div>
+        <div className={styles.containerFooter}>
+            <p className= {styles.footerDesc}>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lacus, purus tincidunt tellus eros. Feugiat velit id sed sit id velit, adipiscing pulvinar orci. Et, bibendum nibh pellentesque id sagittis adipiscing lorem. Elit egestas bibendum morbi vitae, nullam nunc sagittis eget.</p>
+           <div className= {styles.iconSection} >
+            <a href="#" target={"_blank"} rel="noopener noreferrer"><FiFacebook  className= {styles.facebookIcon}/></a>
+            <a href="#" target={"_blank"} rel="noopener noreferrer"><AiOutlineInstagram className= {styles.instaIcon} /></a>
+            <a href="#" target={"_blank"} rel="noopener noreferrer"><FiLinkedin className= {styles.linkedinIcon} /></a>
+            </div>
+    
+        </div> 
+        
+    
+        </>
+        
+    )
+}
+
+export default Footer
\ No newline at end of file
diff --git a/src/Components/Footer/Footer.module.scss b/src/Components/Footer/Footer.module.scss
new file mode 100644
index 0000000..6df9999
--- /dev/null
+++ b/src/Components/Footer/Footer.module.scss
@@ -0,0 +1,120 @@
+
+
+.containerContact {
+    display: flex;
+    flex-direction: column;
+    padding-top: 8.375rem;
+    text-align: center;
+    
+}
+
+.contactHeader, .infoGrad{
+font-family: var(--srijan4-font-2),var(--srijan4-font-1),Verdana, Geneva, Tahoma, sans-serif;  
+font-size: 3rem;
+line-height: 3.5rem;
+font-weight: 700;
+}
+
+.infoGrad{
+    background: var(--srijan4-gradient-6);
+    -webkit-text-fill-color: transparent;
+    -webkit-background-clip: text;
+
+}
+
+
+
+.credInfo {
+    
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    margin-top: 4.5rem;
+    font-size: 1.5rem;
+    line-height: 1.75rem;
+    text-align: center;
+}
+.credItems{
+    width: 16.5rem;
+    margin-right: 2.0625rem;
+    margin-left: 2.0625rem;
+    font-family: var(--srijan4-font-2),var(--srijan4-font-1),Verdana, Geneva, Tahoma, sans-serif;
+}
+.credText{
+    font-weight: 900;
+    display: block;
+    margin-top: 0.5rem;
+}
+
+.containerFooter{
+    margin-top: 6.5rem;
+    background-color: var(--srijan4-dark-grey);
+
+}
+.footerDesc{
+    max-width: 60.625rem;
+    margin: auto;
+   padding-top: 6.1875rem;
+    font-size: 1.5rem;
+    font-weight: 900;
+    line-height: 2.4375rem;
+    text-align: center;
+    color: var(--srijan4-light-grey);
+}
+
+.facebookIcon{
+    width: 2.91rem;
+    height: 2.91rem;
+    color: var(--srijan4-white);
+    margin-right: 4.1475rem;
+    margin-left: 4.1475rem;
+    
+}
+.instaIcon{
+    width: 2.91rem;
+    height: 2.91rem;
+    color: var(--srijan4-white);
+    margin-right: 4.1475rem;
+
+}
+.linkedinIcon
+{
+    width: 2.91rem;
+    height: 2.91rem;
+    color: var(--srijan4-white);
+    margin-right: 4.1475rem;
+}
+.iconSection
+{
+    display: flex;
+    justify-content: center;
+    margin-top: 5.4375rem;
+    padding-bottom: 9.25rem;
+    
+}
+
+@media screen and (max-width: 1200px)
+{
+    .contactHeader, .infoGrad{
+        font-size: 3rem;
+        margin-bottom: 3rem;
+        
+    }
+    .credInfo{
+        flex-direction: column;
+        max-width: 80vh;
+        margin: auto;
+        
+    }
+    .credItems{
+        margin: 0;
+        margin-bottom: 2rem;
+    }
+    .footerDesc{
+        padding-left: 1rem;
+        padding-right: 1rem;
+    }
+    
+
+}
+
diff --git a/src/Components/index.jsx b/src/Components/index.jsx
index ece620d..8d166d5 100644
--- a/src/Components/index.jsx
+++ b/src/Components/index.jsx
@@ -1,4 +1,5 @@
 import Button from "./Button/Button";
 import Navbar from "./Navbar/Navbar";
+import Footer from "./Footer/Footer";
 
-export { Button, Navbar };
+export { Button, Navbar, Footer };
diff --git a/src/index.scss b/src/index.scss
index c08e3cc..fc91a65 100644
--- a/src/index.scss
+++ b/src/index.scss
@@ -1,19 +1,29 @@
 @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");
+@font-face{
+  font-family: 'Gilroy-Bold';
+  src: url('/fonts/gilroy/Gilroy-Bold.ttf')
+}
 
 :root {
-
+  
+  --srijan4-font-2: "Gilroy-Bold", sans-serif;
   --srijan4-font-1: "Poppins", sans-serif;
 
   --srijan4-dark-blue: #010044;
   --srijan4-dark-pink: #B4015F;
   --srijan4-med-pink: #EA0064;
   --srijan4-light-pink: #FF5F9F;
+  --srijan4-dark-grey: #15131A;
+  --srijan4-light-grey: #ffffffa3;
+  --srijan4-white: #fff;
+
 
   --srijan4-gradient-1: linear-gradient(180.56deg, #0704B9 -22.26%, #B4015F 159.83%);
   --srijan4-gradient-2: linear-gradient(161.91deg, #010044 0%, #030156 28.12%, #02014C 66.54%, #B4015F 114.02%);
   --srijan4-gradient-3: linear-gradient(161.91deg, #010044 0%, #02014C 66.54%);
   --srijan4-gradient-4: linear-gradient(161.91deg, #02010D 0%, #040344 66.54%);
   --srijan4-gradient-5: linear-gradient(175.09deg, #010044 -8.29%, #030156 24.29%, #02014C 68.8%, #B4015F 123.8%);
+  --srijan4-gradient-6: linear-gradient(180deg, rgba(182,33,254,1) 35%, rgba(31,209,249,1) 100%);
 
   --heading-1-text-weight: 600;
   --heading-2-text-weight: 500;