diff --git a/src/Sections/Card.css b/src/Sections/Card.css
new file mode 100644
index 00000000..d32d59ae
--- /dev/null
+++ b/src/Sections/Card.css
@@ -0,0 +1,34 @@
+.card {
+    width: 300px;
+    height: 200px;
+    background-color:white;
+    border-radius: 10px;
+    border-color: beige;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
+    padding: 20px;
+    text-align: center;
+  }
+  
+  .card h2 {
+    margin-top: 0;
+    color: #333333;
+  }
+  
+  .card p {
+    color: #666666;
+  }
+  .img {
+    width: 100%;
+    height: auto;
+    display: block;
+  }
+  .card:hover {
+    transform: scale(1.05); 
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2); 
+  }
+  @media (max-width: 640px) {
+    .sm\:grid-cols-1 {
+      grid-template-columns: 1fr;
+    }
+  }
+  
diff --git a/src/Sections/Home.tsx b/src/Sections/Home.tsx
index 0a95dabc..873043b3 100644
--- a/src/Sections/Home.tsx
+++ b/src/Sections/Home.tsx
@@ -4,14 +4,17 @@ import { TextGenerateEffect } from "@/components/ui/text-generate-effect";
 import { AboutUs } from "./AboutUs";
 import { Events } from "./Events";
 import { Stats } from "./Stats";
-import { Sponsors } from "./Sponsors";
+
 import { Developers } from "./Developers";
 import { Footer } from "@/components/Footer";
 import { Team } from "./Team";
+
+import { Sponsors } from "./Sponsors";
 import { ScrollToTopButton } from "@/components/ScrollToTopButton";
 import { Talks } from "./Talks";
 import { Link } from "react-router-dom";
 
+
 export const Home = () => {
   return (
     <div className="h-full w-screen flex flex-col">
@@ -48,7 +51,7 @@ export const Home = () => {
         <Stats />
       </div>
       <div>
-        <Sponsors />
+         <Sponsors/>
       </div>
       <div>
         <Talks />
diff --git a/src/Sections/Sponsors.tsx b/src/Sections/Sponsors.tsx
index e63950db..aab7f1c2 100644
--- a/src/Sections/Sponsors.tsx
+++ b/src/Sections/Sponsors.tsx
@@ -1,15 +1,23 @@
+
+import './Card.css'; 
+import devtron from '../images/devtron.png';
+import microsoft from '../images/microsoft.png';
+import tata from'../images/tata 1 mg.png';
+import epam from '../images/epam.png';
 export const Sponsors = () => {
   return (
-    <div
-      id="sponsors"
-      className="flex flex-col items-center justify-center bg-black w-screen h-full"
-    >
-      <div>
-        <h2 className="text-white text-3xl font-bold mb-4 mt-[400px]">
-          Our Sponsors
-        </h2>
-        <div className=" p-4 rounded-lg shadow-lg"></div>
+    <div  id="sponsors" className="flex flex-col items-center justify-center bg-black w-screen h-screen">
+      <div className="mb-96">
+        <h2 className="text-white text-3xl font-bold mb-20 text-center">Our Sponsors</h2>
+        <div className="p-4 rounded-lg shadow-lg grid sm:grid-cols-1 md:grid-cols-2 gap-20">
+          <div className='card ease-in-out '><img src={devtron} className='img pt-8'></img></div>
+          <div className='card ease-in-out '><img src={microsoft} className='img pt-8'></img></div>
+          <div className='card ease-in-out '><img src={tata} className='img'></img></div>
+          <div className='card ease-in-out '><img src={epam}  className='img h-36'></img></div>
+        </div>
       </div>
     </div>
   );
 };
+
+
diff --git a/src/images/devtron.png b/src/images/devtron.png
new file mode 100644
index 00000000..4a8b56f0
Binary files /dev/null and b/src/images/devtron.png differ
diff --git a/src/images/epam.png b/src/images/epam.png
new file mode 100644
index 00000000..3ed579d8
Binary files /dev/null and b/src/images/epam.png differ
diff --git a/src/images/microsoft.png b/src/images/microsoft.png
new file mode 100644
index 00000000..dbedf2af
Binary files /dev/null and b/src/images/microsoft.png differ
diff --git a/src/images/tata 1 mg.png b/src/images/tata 1 mg.png
new file mode 100644
index 00000000..ad788793
Binary files /dev/null and b/src/images/tata 1 mg.png differ