diff --git a/Interface/src/Components/about/about.component.html b/Interface/src/Components/about/about.component.html
index 89e5b545..fbb6908a 100644
--- a/Interface/src/Components/about/about.component.html
+++ b/Interface/src/Components/about/about.component.html
@@ -1,7 +1,7 @@
 <div class="responsive-container-block bigContainer">
   <div class="responsive-container-block Container bottomContainer">
     <div class="ultimateImg">
-      <img class="mainImg" src="assets/team.jpg" alt="team">
+      <img class="mainImg" src="assets/team.webp" alt="team">
     </div>
     <div class="allText bottomText">
       <p class="text-blk headingText">
diff --git a/Interface/src/Components/footer/footer.component.css b/Interface/src/Components/footer/footer.component.css
index 6370a188..e41309d1 100644
--- a/Interface/src/Components/footer/footer.component.css
+++ b/Interface/src/Components/footer/footer.component.css
@@ -1,5 +1,5 @@
 .cta-section {
-  background: url('../../assets/hero-bg.png');
+  background: url('../../assets/hero-bg.webp');
   background-repeat: no-repeat;
   background-position: right;
   background-color: #0a2640;
@@ -144,4 +144,4 @@
   .cta-section {
     width: 90%;
   }
-}
\ No newline at end of file
+}
diff --git a/Interface/src/Components/footer/footer.component.html b/Interface/src/Components/footer/footer.component.html
index 1ea784b5..e3551b65 100644
--- a/Interface/src/Components/footer/footer.component.html
+++ b/Interface/src/Components/footer/footer.component.html
@@ -13,7 +13,7 @@ <h1>{{ 'FOOTER_SUBSCRIBE_TITLE' | translate }}</h1>
 
   <div class="footer-content">
     <div class="footer-section logo">
-      <img src="assets/blacklogo.png" alt="FeedPulse Logo" class="logo-img">
+      <img src="assets/backlogo.webp" alt="FeedPulse Logo" class="logo-img">
       <p>{{ 'FOOTER_DESCRIPTION' | translate }}</p>
     </div>
 
diff --git a/Interface/src/Components/home/home.component.css b/Interface/src/Components/home/home.component.css
index dd4147d2..d54204b2 100644
--- a/Interface/src/Components/home/home.component.css
+++ b/Interface/src/Components/home/home.component.css
@@ -24,7 +24,7 @@
   align-items: center; /* vertical alignment */
   justify-content: center;
   position: relative;
-  background: url('../../assets/hero-bg.png');
+  background: url('../../assets/hero-bg.webp');
   background-position: right top;
   background-repeat: no-repeat;
   max-width: 100%;
@@ -291,7 +291,7 @@
     position: relative;
   }
   .timeline-section {
-    background-image: url('../../assets/home.jpg');
+    background-image: url('../../assets/home.webp');
     background-repeat: no-repeat;
     background-position: center;
     background-size: cover;
diff --git a/Interface/src/Components/home/home.component.html b/Interface/src/Components/home/home.component.html
index 6d55b278..b16805da 100644
--- a/Interface/src/Components/home/home.component.html
+++ b/Interface/src/Components/home/home.component.html
@@ -18,7 +18,7 @@ <h1>FeedPulse</h1>
     </ng-template>
   </div>
   <div class="right-side">
-    <img src="assets/GenericHero.png" alt="Description">
+    <img src="assets/GenericHero.webp" alt="Description">
   </div>
 </section>
 
diff --git a/Interface/src/Components/navbar/navbar.component.html b/Interface/src/Components/navbar/navbar.component.html
index 94213fcf..de382c82 100644
--- a/Interface/src/Components/navbar/navbar.component.html
+++ b/Interface/src/Components/navbar/navbar.component.html
@@ -1,6 +1,6 @@
 <nav [ngClass]="{'navbar': true, 'scrolled': isScrolled}">
   <div class="navbar-brand">
-    <img src="assets/logo.png" alt="FeedPulse Logo" class="logo-img">
+    <img src="assets/logo.webp" alt="FeedPulse Logo" class="logo-img">
 
         <!-- Hamburger (mobile only) -->
     <button class="hamburger" (click)="toggleMenu()" aria-label="Toggle menu">
diff --git a/Interface/src/assets/GenericHero.webp b/Interface/src/assets/GenericHero.webp
new file mode 100644
index 00000000..5f1a4b65
Binary files /dev/null and b/Interface/src/assets/GenericHero.webp differ
diff --git a/Interface/src/assets/backlogo.webp b/Interface/src/assets/backlogo.webp
new file mode 100644
index 00000000..a101d805
Binary files /dev/null and b/Interface/src/assets/backlogo.webp differ
diff --git a/Interface/src/assets/hero-bg.webp b/Interface/src/assets/hero-bg.webp
new file mode 100644
index 00000000..e3362b03
Binary files /dev/null and b/Interface/src/assets/hero-bg.webp differ
diff --git a/Interface/src/assets/home.webp b/Interface/src/assets/home.webp
new file mode 100644
index 00000000..516e343c
Binary files /dev/null and b/Interface/src/assets/home.webp differ
diff --git a/Interface/src/assets/logo.webp b/Interface/src/assets/logo.webp
new file mode 100644
index 00000000..4cd97124
Binary files /dev/null and b/Interface/src/assets/logo.webp differ
diff --git a/Interface/src/assets/team.webp b/Interface/src/assets/team.webp
new file mode 100644
index 00000000..f5b014f8
Binary files /dev/null and b/Interface/src/assets/team.webp differ