diff --git a/public/images/bg-header2.jpg b/public/images/bg-header2.jpg
new file mode 100644
index 0000000..ed8b897
Binary files /dev/null and b/public/images/bg-header2.jpg differ
diff --git a/public/images/bg-header3.jpg b/public/images/bg-header3.jpg
new file mode 100644
index 0000000..eeb8041
Binary files /dev/null and b/public/images/bg-header3.jpg differ
diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
index a19bca4..8f69006 100644
--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -15,7 +15,7 @@ export default function Hero() {
         autoplay={{ delay: 4000 }}
         loop
       >
-        <SwiperSlide className="bg-[url(/images/bg-header2.webp)]">
+        <SwiperSlide className="bg-[url(/images/bg-header2.jpg)]">
           <section className="section section-lg text-colorText2! bg-colorExt5/50 w-full h-full">
             <div className="container">
               <div className="row">
@@ -27,7 +27,7 @@ export default function Hero() {
             </div>
           </section>
         </SwiperSlide>
-        <SwiperSlide className="bg-[url(/images/bg-header3.webp)]">
+        <SwiperSlide className="bg-[url(/images/bg-header3.jpg)]">
           <section className="section section-lg text-colorText2! bg-colorExt5/50 w-full h-full">
             <div className="container">
               <div className="row">