diff --git a/src/client/components/programs/BoardPicture.tsx b/src/client/components/programs/BoardPicture.tsx
index f70bac7c..010726d1 100644
--- a/src/client/components/programs/BoardPicture.tsx
+++ b/src/client/components/programs/BoardPicture.tsx
@@ -10,7 +10,7 @@ const BoardPicture = () => {
       {/* Text Overlay */}
       <div className="absolute inset-0 flex items-end justify-center p-4">
         <div className="w-5/6 rounded-b-xl bg-gradient-to-t from-black to-transparent p-4">
-          <p className="text-lg text-white">
+          <p className="font-redhat text-lg text-white">
             We offer a variety of programs that provide members of all experience levels with opportunities to network, socialize, and develop
             technical and leadership skills. Read on to learn more about our Intern Program, Engineering Team, Web Team, and Intramural sports league.
           </p>
diff --git a/src/client/components/programs/Carousel.tsx b/src/client/components/programs/Carousel.tsx
new file mode 100644
index 00000000..6efc397f
--- /dev/null
+++ b/src/client/components/programs/Carousel.tsx
@@ -0,0 +1,153 @@
+import { cn } from "@/shared/utils";
+import type { EmblaCarouselType, EmblaEventType, EmblaOptionsType } from "embla-carousel";
+import useEmblaCarousel from "embla-carousel-react";
+import React, { useCallback, useEffect, useRef } from "react";
+import { NextButton, PrevButton, usePrevNextButtons } from "./CarouselArrows";
+import ProgramImages from "./ProgramImages";
+import Testimonials from "./Testimonials";
+
+const TWEEN_FACTOR_BASE = 0.52;
+
+const numberWithinRange = (number: number, min: number, max: number): number => Math.min(Math.max(number, min), max);
+
+type PropType = {
+  options?: EmblaOptionsType;
+  purpose: string;
+  prog: string;
+};
+
+const TestimonialCarousel: React.FC<PropType> = ({ prog, purpose }) => {
+  let slides;
+  if (purpose == "Testimonials") {
+    slides = Testimonials.find((t) => t.program === prog)?.testimonials ?? [];
+  } else {
+    slides = ProgramImages.find((i) => i.program === prog)?.images ?? [];
+  }
+
+  const [emblaRef, emblaApi] = useEmblaCarousel({ loop: true });
+  const tweenFactor = useRef(0);
+  const tweenNodes = useRef<Array<HTMLElement>>([]);
+
+  const { nextBtnDisabled, onNextButtonClick, onPrevButtonClick, prevBtnDisabled } = usePrevNextButtons(emblaApi);
+
+  const setTweenNodes = useCallback((emblaApi: EmblaCarouselType): void => {
+    tweenNodes.current = emblaApi.slideNodes().map((slideNode) => {
+      return slideNode.querySelector(".embla__slide__image") as HTMLElement;
+    });
+  }, []);
+
+  const setTweenFactor = useCallback((emblaApi: EmblaCarouselType) => {
+    tweenFactor.current = TWEEN_FACTOR_BASE * emblaApi.scrollSnapList().length;
+  }, []);
+
+  const tweenScale = useCallback((emblaApi: EmblaCarouselType, eventName?: EmblaEventType) => {
+    const engine = emblaApi.internalEngine();
+    const scrollProgress = emblaApi.scrollProgress();
+    const slidesInView = emblaApi.slidesInView();
+    const isScrollEvent = eventName === "scroll";
+
+    emblaApi.scrollSnapList().forEach((scrollSnap, snapIndex) => {
+      let diffToTarget = scrollSnap - scrollProgress;
+      const slidesInSnap = engine.slideRegistry[snapIndex];
+
+      slidesInSnap.forEach((slideIndex) => {
+        if (isScrollEvent && !slidesInView.includes(slideIndex)) return;
+
+        if (engine.options.loop) {
+          engine.slideLooper.loopPoints.forEach((loopItem) => {
+            const target = loopItem.target();
+
+            if (slideIndex === loopItem.index && target !== 0) {
+              const sign = Math.sign(target);
+
+              if (sign === -1) {
+                diffToTarget = scrollSnap - (1 + scrollProgress);
+              }
+              if (sign === 1) {
+                diffToTarget = scrollSnap + (1 - scrollProgress);
+              }
+            }
+          });
+        }
+
+        const tweenValue = 1.25 - Math.abs(diffToTarget * tweenFactor.current);
+        const scale = numberWithinRange(tweenValue, 0, 1).toString();
+        const tweenNode = tweenNodes.current[slideIndex];
+        tweenNode.style.transform = `scale(${scale})`;
+      });
+    });
+  }, []);
+
+  useEffect(() => {
+    if (!emblaApi) return;
+
+    setTweenNodes(emblaApi);
+    setTweenFactor(emblaApi);
+    tweenScale(emblaApi);
+
+    emblaApi.on("reInit", setTweenNodes).on("reInit", setTweenFactor).on("reInit", tweenScale).on("scroll", tweenScale).on("slideFocus", tweenScale);
+  }, [emblaApi, tweenScale]);
+
+  return (
+    <div
+      className={cn(
+        {
+          "flex items-center justify-center": purpose === "Testimonials",
+        },
+        `relative m-auto pb-8`,
+      )}
+    >
+      {purpose === "Testimonials" ? (
+        <>
+          <PrevButton onClick={onPrevButtonClick} disabled={prevBtnDisabled} />
+          <div className="absolute left-0 top-0 z-10 ml-[8%] h-full w-16 bg-gradient-to-r from-white to-transparent" />
+        </>
+      ) : null}
+
+      <div className="overflow-hidden" ref={emblaRef}>
+        <div className="flex touch-pan-y touch-pinch-zoom">
+          {slides.map((slide, index) => (
+            <div className="flex min-w-0 flex-[0_0_100%] items-center justify-center [transform:translate3d(0,0,0)] md:flex-[0_0_50%]" key={index}>
+              <div className="embla__slide__image rounded-2xl bg-gradient-to-r from-saseBlue via-[#7DC242] to-saseGreen p-[4px]">
+                <div className="embla__slide__image group relative flex items-center justify-center hover:cursor-pointer">
+                  {/* If slide element is not a string, carousel is for testimonials. If it is, carousel is for images */}
+                  {typeof slide != "string" ? (
+                    <img src={slide.image} alt={`Image`} className="aspect-auto rounded-xl" />
+                  ) : (
+                    <img src={slide} alt={`Image`} className="aspect-auto rounded-xl" />
+                  )}
+                  {typeof slide != "string" ? (
+                    <div className="absolute inset-0 flex flex-col items-center justify-end rounded-xl bg-saseGray/60 hover:bg-saseGray/90">
+                      <p className="absolute pb-10 font-redhat text-xl font-semibold opacity-100 transition duration-300 group-hover:opacity-0">
+                        {slide.name}
+                      </p>
+                      <p className="absolute pb-4 font-redhat text-lg opacity-100 transition duration-300 group-hover:opacity-0">{slide.position}</p>
+                      <p className="flex h-0 w-full items-center justify-center overflow-hidden px-4 text-center font-redhat text-lg font-medium text-black opacity-0 transition-all duration-700 ease-in-out group-hover:h-full group-hover:translate-y-0 group-hover:opacity-100 md:text-sm lg:text-base">
+                        "{slide.quote}"
+                      </p>
+                    </div>
+                  ) : null}
+                </div>
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+      {purpose === "Testimonials" ? (
+        <>
+          <div className="absolute right-0 top-0 z-10 mr-[8%] h-full w-16 bg-gradient-to-l from-white to-transparent" />
+          <NextButton onClick={onNextButtonClick} disabled={nextBtnDisabled} />
+        </>
+      ) : (
+        <div className="mt-4 grid justify-center">
+          <div className="grid grid-cols-[1fr,1fr] items-center gap-2">
+            <PrevButton onClick={onPrevButtonClick} disabled={prevBtnDisabled} />
+            <NextButton onClick={onNextButtonClick} disabled={nextBtnDisabled} />
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default TestimonialCarousel;
diff --git a/src/client/components/programs/CarouselArrows.tsx b/src/client/components/programs/CarouselArrows.tsx
new file mode 100644
index 00000000..b1475e09
--- /dev/null
+++ b/src/client/components/programs/CarouselArrows.tsx
@@ -0,0 +1,84 @@
+import type { EmblaCarouselType } from "embla-carousel";
+import type { ComponentPropsWithRef } from "react";
+import React, { useCallback, useEffect, useState } from "react";
+import "@components/home/embla.css";
+
+type UsePrevNextButtonsType = {
+  prevBtnDisabled: boolean;
+  nextBtnDisabled: boolean;
+  onPrevButtonClick: () => void;
+  onNextButtonClick: () => void;
+};
+
+export const usePrevNextButtons = (
+  emblaApi: EmblaCarouselType | undefined,
+  onButtonClick?: (emblaApi: EmblaCarouselType) => void,
+): UsePrevNextButtonsType => {
+  const [prevBtnDisabled, setPrevBtnDisabled] = useState(true);
+  const [nextBtnDisabled, setNextBtnDisabled] = useState(true);
+
+  const onPrevButtonClick = useCallback(() => {
+    if (!emblaApi) return;
+    emblaApi.scrollPrev();
+    if (onButtonClick) onButtonClick(emblaApi);
+  }, [emblaApi, onButtonClick]);
+
+  const onNextButtonClick = useCallback(() => {
+    if (!emblaApi) return;
+    emblaApi.scrollNext();
+    if (onButtonClick) onButtonClick(emblaApi);
+  }, [emblaApi, onButtonClick]);
+
+  const onSelect = useCallback((emblaApi: EmblaCarouselType) => {
+    setPrevBtnDisabled(!emblaApi.canScrollPrev());
+    setNextBtnDisabled(!emblaApi.canScrollNext());
+  }, []);
+
+  useEffect(() => {
+    if (!emblaApi) return;
+
+    onSelect(emblaApi);
+    emblaApi.on("reInit", onSelect).on("select", onSelect);
+  }, [emblaApi, onSelect]);
+
+  return {
+    prevBtnDisabled,
+    nextBtnDisabled,
+    onPrevButtonClick,
+    onNextButtonClick,
+  };
+};
+
+type PropType = ComponentPropsWithRef<"button">;
+
+export const PrevButton: React.FC<PropType> = (props) => {
+  const { children, ...restProps } = props;
+
+  return (
+    <button className="embla__button embla__button--prev text-black" type="button" {...restProps}>
+      <svg className="h-[35%] w-[35%]" viewBox="0 0 532 532">
+        <path
+          fill="currentColor"
+          d="M355.66 11.354c13.793-13.805 36.208-13.805 50.001 0 13.785 13.804 13.785 36.238 0 50.034L201.22 266l204.442 204.61c13.785 13.805 13.785 36.239 0 50.044-13.793 13.796-36.208 13.796-50.002 0a5994246.277 5994246.277 0 0 0-229.332-229.454 35.065 35.065 0 0 1-10.326-25.126c0-9.2 3.393-18.26 10.326-25.2C172.192 194.973 332.731 34.31 355.66 11.354Z"
+        />
+      </svg>
+      {children}
+    </button>
+  );
+};
+
+export const NextButton: React.FC<PropType> = (props) => {
+  const { children, ...restProps } = props;
+
+  return (
+    <button className="embla__button embla__button--next text-black" type="button" {...restProps}>
+      <svg className="h-[35%] w-[35%]" viewBox="0 0 532 532">
+        <path
+          fill="currentColor"
+          d="M176.34 520.646c-13.793 13.805-36.208 13.805-50.001 0-13.785-13.804-13.785-36.238 0-50.034L330.78 266 126.34 61.391c-13.785-13.805-13.785-36.239 0-50.044 13.793-13.796 36.208-13.796 50.002 0 22.928 22.947 206.395 206.507 229.332 229.454a35.065 35.065 0 0 1 10.326 25.126c0 9.2-3.393 18.26-10.326 25.2-45.865 45.901-206.404 206.564-229.332 229.52Z"
+        />
+      </svg>
+      {children}
+    </button>
+  );
+};
diff --git a/src/client/components/programs/FAQCard.tsx b/src/client/components/programs/FAQCard.tsx
index 1bd2e878..52871588 100644
--- a/src/client/components/programs/FAQCard.tsx
+++ b/src/client/components/programs/FAQCard.tsx
@@ -42,7 +42,7 @@ const FAQItem: React.FC<FAQItemProps> = ({ answer, question }) => {
 
 const FAQ: React.FC<FAQProps> = ({ faqData }) => {
   return (
-    <div className="w-full p-8">
+    <div className="w-full p-8 font-redhat">
       {faqData.map((item, index) => (
         <FAQItem key={index} question={item.question} answer={item.answer} />
       ))}
diff --git a/src/client/components/programs/GoalCard.tsx b/src/client/components/programs/GoalCard.tsx
index 660a59df..270f1266 100644
--- a/src/client/components/programs/GoalCard.tsx
+++ b/src/client/components/programs/GoalCard.tsx
@@ -17,7 +17,7 @@ const GoalCard = ({ color, text }: GoalCardProps) => {
           },
         )}
       >
-        <p className="text-2xl text-black">{text}</p>
+        <p className="font-redhat text-2xl text-black">{text}</p>
       </div>
     </div>
   );
diff --git a/src/client/components/programs/InfoCard.tsx b/src/client/components/programs/InfoCard.tsx
index 2ac570d2..6493d439 100644
--- a/src/client/components/programs/InfoCard.tsx
+++ b/src/client/components/programs/InfoCard.tsx
@@ -6,7 +6,7 @@ interface SimpleCardProps {
 
 const InfoCard: React.FC<SimpleCardProps> = ({ text }) => {
   return (
-    <div className="relative mx-auto mb-14 w-full max-w-4xl p-5">
+    <div className="relative mx-auto mb-14 w-full max-w-4xl p-5 font-redhat">
       {/* Main Card with Black Border and Green Shadow */}
       <div className="relative flex flex-col items-center rounded-3xl border-2 border-black bg-gray-100 p-12 shadow-[24px_24px_0px_#7DC242]">
         {/* Text Content */}
diff --git a/src/client/components/programs/ProgramCard.tsx b/src/client/components/programs/ProgramCard.tsx
index cafa9bd3..7fafa680 100644
--- a/src/client/components/programs/ProgramCard.tsx
+++ b/src/client/components/programs/ProgramCard.tsx
@@ -18,11 +18,11 @@ const ProgramCard: React.FC<ProgramCardProps> = ({ image, link, text }) => {
 
         {/* Text Content */}
         <div className="flex flex-col justify-between">
-          <p className="mb-4 text-xl text-black">{text}</p>
+          <p className="mb-4 font-redhat text-xl text-black">{text}</p>
 
           {/* Learn More Button */}
           <a href={link} target="_blank" rel="noopener noreferrer">
-            <button className="mt-4 w-40 rounded-full bg-saseBlueLight py-2 text-center text-lg italic text-white transition duration-300 hover:scale-105 hover:bg-saseBlue focus:outline-none focus:ring-2 focus:ring-blue-500">
+            <button className="mt-4 w-40 rounded-full bg-saseBlueLight py-2 text-center font-redhat text-lg italic text-white transition duration-300 hover:scale-105 hover:bg-saseBlue focus:outline-none focus:ring-2 focus:ring-blue-500">
               LEARN MORE
             </button>
           </a>
diff --git a/src/client/components/programs/ProgramImages.ts b/src/client/components/programs/ProgramImages.ts
new file mode 100644
index 00000000..b2b393b8
--- /dev/null
+++ b/src/client/components/programs/ProgramImages.ts
@@ -0,0 +1,25 @@
+import InternsPic from "@assets/interns/SaseInterns.png";
+import SETPic from "@assets/set/SaseSet.png";
+import SportsPic from "@assets/sports/SaseSports.png";
+import WebDevPic from "@assets/webdev/WebDevTeam.jpg";
+
+const ProgramImages = [
+  {
+    program: "Interns",
+    images: [InternsPic, InternsPic, InternsPic, InternsPic],
+  },
+  {
+    program: "SET",
+    images: [SETPic, SETPic, SETPic, SETPic],
+  },
+  {
+    program: "Web Dev",
+    images: [WebDevPic, WebDevPic, WebDevPic, WebDevPic],
+  },
+  {
+    program: "Sports",
+    images: [SportsPic, SportsPic, SportsPic, SportsPic],
+  },
+];
+
+export default ProgramImages;
diff --git a/src/client/components/programs/TestimonialCard.tsx b/src/client/components/programs/TestimonialCard.tsx
deleted file mode 100644
index be237334..00000000
--- a/src/client/components/programs/TestimonialCard.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import { imageUrls } from "@/client/assets/imageUrls";
-import React from "react";
-
-interface TestimonialCardProps {
-  image: string;
-  text: string;
-  name: string;
-  title: string;
-}
-
-const TestimonialCard: React.FC<TestimonialCardProps> = ({ image, name, text, title }) => {
-  return (
-    <div className="mb-24 flex max-w-7xl flex-col items-center gap-12 bg-white p-6 md:flex-row">
-      {/* Image Section */}
-      <div className="relative flex-shrink-0 rounded-3xl border-2 border-black shadow-[18px_18px_0px_#7DC242]">
-        <img src={image} alt={name} className="h-[500px] w-[400px] rounded-3xl object-cover" />
-        {/* Decorative Icon */}
-        <img src={imageUrls["Star.png"]} alt="Decorative star" className="absolute -bottom-6 -left-9 h-20 w-20" />
-      </div>
-
-      {/* Text Section */}
-      <div className="border-l-4 border-saseGreen pl-6">
-        <p className="mb-4 text-3xl text-gray-800">“{text}”</p>
-        <p className="font-semibold text-saseGreen">
-          {name}, {title}
-        </p>
-      </div>
-    </div>
-  );
-};
-
-export default TestimonialCard;
diff --git a/src/client/components/programs/Testimonials.ts b/src/client/components/programs/Testimonials.ts
new file mode 100644
index 00000000..a6696014
--- /dev/null
+++ b/src/client/components/programs/Testimonials.ts
@@ -0,0 +1,110 @@
+//import { imageUrls } from "@assets/imageUrls";
+import BryantCao from "@assets/interns/InternTestimonial.png";
+import SET2024 from "@assets/set/SetProject.png";
+import CameronMcMullen from "@assets/sports/SportsTestimonial.jpeg";
+
+const Testimonials = [
+  {
+    program: "Interns",
+    testimonials: [
+      {
+        name: "Bryant Cao",
+        position: "2024 Intern",
+        quote:
+          "I really enjoyed my time with SASE Interns as it was a great mixture of  fun and general skill building. I got to connect with other SASE members, get more involved with SASE, and improve a variety of skills. But there was also tons of times where I got to joke around making Interns never feel like a burden.",
+        image: BryantCao,
+      },
+      {
+        name: "Bryant Cao",
+        position: "2024 Intern",
+        quote:
+          "I really enjoyed my time with SASE Interns as it was a great mixture of  fun and general skill building. I got to connect with other SASE members, get more involved with SASE, and improve a variety of skills. But there was also tons of times where I got to joke around making Interns never feel like a burden.",
+        image: BryantCao,
+      },
+      {
+        name: "Bryant Cao",
+        position: "2024 Intern",
+        quote:
+          "I really enjoyed my time with SASE Interns as it was a great mixture of  fun and general skill building. I got to connect with other SASE members, get more involved with SASE, and improve a variety of skills. But there was also tons of times where I got to joke around making Interns never feel like a burden.",
+        image: BryantCao,
+      },
+      {
+        name: "Bryant Cao",
+        position: "2024 Intern",
+        quote:
+          "I really enjoyed my time with SASE Interns as it was a great mixture of  fun and general skill building. I got to connect with other SASE members, get more involved with SASE, and improve a variety of skills. But there was also tons of times where I got to joke around making Interns never feel like a burden.",
+        image: BryantCao,
+      },
+    ],
+  },
+  {
+    program: "SET",
+    testimonials: [
+      {
+        name: "SET Bro",
+        position: "2023 Project",
+        quote:
+          "During SET's first semester, SET successfully developed a campus cleaner robot designed to autonomously identify and pick up trash 🤖. This innovative project not only helped keep our campus clean but also provided valuable experience in robotics, programming, and teamwork.",
+        image: SET2024,
+      },
+      {
+        name: "SET Dumpy",
+        position: "2023-2024 Project",
+        quote:
+          "A campus cleaner robot designed to autonomously identify and pick up trash 🤖. This innovative project keeps our campus clean and provided valuable experience in robotics, programming, and teamwork.",
+        image: SET2024,
+      },
+      {
+        name: "2025 Project Name",
+        position: "2024-2025 Project",
+        quote: "Coming soon...",
+        image: SET2024,
+      },
+      {
+        name: "2026 Project Name",
+        position: "2025-2026 Project",
+        quote: "Coming soon...",
+        image: SET2024,
+      },
+    ],
+  },
+  {
+    program: "Web Dev",
+    testimonials: [],
+  },
+  {
+    program: "Sports",
+    testimonials: [
+      {
+        name: "Cameron McMullen",
+        position: "SASE Sports Member",
+        quote:
+          "SASE sports is a fun way to connect with people while being active! I’m really glad I got to join and make friends while getting to play soccer again, and everyone is really nice to play with! We get to joke around and break a swear together, and I’ll cherish the memories and friends I made far beyond college.",
+        image: CameronMcMullen,
+      },
+      {
+        name: "Cameron McMullen",
+        position: "SASE Sports Member",
+        quote:
+          "SASE sports is a fun way to connect with people while being active! I’m really glad I got to join and make friends while getting to play soccer again, and everyone is really nice to play with! We get to joke around and break a swear together, and I’ll cherish the memories and friends I made far beyond college.",
+        image: CameronMcMullen,
+      },
+      {
+        name: "Cameron McMullen",
+        position: "SASE Sports Member",
+        quote:
+          "SASE sports is a fun way to connect with people while being active! I’m really glad I got to join and make friends while getting to play soccer again, and everyone is really nice to play with! We get to joke around and break a swear together, and I’ll cherish the memories and friends I made far beyond college.",
+        image: CameronMcMullen,
+      },
+      {
+        name: "Cameron McMullen",
+        position: "SASE Sports Member",
+        quote:
+          "SASE sports is a fun way to connect with people while being active! I’m really glad I got to join and make friends while getting to play soccer again, and everyone is really nice to play with! We get to joke around and break a swear together, and I’ll cherish the memories and friends I made far beyond college.",
+        image: CameronMcMullen,
+      },
+    ],
+  },
+];
+
+export default Testimonials;
diff --git a/src/client/routes/interns.tsx b/src/client/routes/interns.tsx
index 23e249c0..b7c10c6d 100644
--- a/src/client/routes/interns.tsx
+++ b/src/client/routes/interns.tsx
@@ -1,12 +1,10 @@
-import InternTestimonial from "@assets/interns/InternTestimonial.png";
-import InternsPic from "@assets/interns/SaseInterns.png";
+import Carousel from "@/client/components/programs/Carousel";
+import { imageUrls } from "@assets/imageUrls";
 import FAQ from "@components/programs/FAQCard";
+import { faqData } from "@components/programs/faqInterns";
 import GoalCard from "@components/programs/GoalCard";
 import InfoCard from "@components/programs/InfoCard";
-import TestimonialCard from "@components/programs/TestimonialCard";
 import { createFileRoute } from "@tanstack/react-router";
-import { imageUrls } from "../assets/imageUrls";
-import { faqData } from "../components/programs/faqInterns";
 import { seo } from "../utils/seo";
 
 export const Route = createFileRoute("/interns")({
@@ -20,12 +18,12 @@ export const Route = createFileRoute("/interns")({
 
   component: () => {
     return (
-      <div className="mt-12 flex min-h-screen flex-col items-center bg-white font-[Poppins]">
+      <div className="mt-12 flex min-h-screen flex-col items-center bg-white">
         <div className="flex w-full max-w-7xl flex-col items-start px-4 py-8 sm:flex-row">
           <header className="mr-8 mt-10 flex items-center px-5">
             {/* Green Line and Text in Row */}
             <div className="mr-5 h-40 w-1.5 bg-saseGreen"></div>
-            <h2 className="text-7xl font-semibold leading-tight text-gray-800">
+            <h2 className="font-oswald text-7xl font-semibold leading-tight text-gray-800">
               SASE
               <br />
               INTERNS
@@ -43,27 +41,14 @@ export const Route = createFileRoute("/interns")({
             }
           />
         </div>
-        {/* Placeholder Image */}
         <div className="w-full max-w-7xl px-4 py-8">
-          <div className="mx-auto mb-24 w-full max-w-7xl px-4">
-            <img
-              src={InternsPic}
-              alt="Placeholder"
-              className="w-full rounded-3xl border-4 border-saseGreen"
-              style={{ height: "600px", objectFit: "cover" }}
-            />
-          </div>
-          <header className="mb-6 flex max-w-7xl items-center px-5">
+          <Carousel purpose="Images" prog="Interns" />
+          <header className="mb-6 flex max-w-7xl items-center px-5 font-oswald">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
             <h2 className="text-4xl text-gray-800">Testimonials</h2>
           </header>
-          <TestimonialCard
-            image={InternTestimonial}
-            text="I really enjoyed my time with SASE Interns as it was a great mixture of  fun and general skill building. I got to connect with other SASE members, get more involved with SASE, and improve a variety of skills. But there was also tons of times where I got to joke around making Interns never feel like a burden."
-            name="Bryant Cao"
-            title="2024 Intern"
-          />
-          <header className="mb-12 flex max-w-7xl items-center px-5">
+          <Carousel purpose="Testimonials" prog="Interns" />
+          <header className="mb-12 flex max-w-7xl items-center px-5 font-oswald">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
             <h2 className="text-4xl text-gray-800">Goals & Outcomes</h2>
           </header>
@@ -72,7 +57,7 @@ export const Route = createFileRoute("/interns")({
             <GoalCard text="Develop essential professional skills and experiences to add to your resume." color="green" />
             <GoalCard text="Connect with other SASErs and board members through intern-exclusive networking events." color="blue" />
           </div>
-          <header className="flex max-w-7xl items-center px-5">
+          <header className="flex max-w-7xl items-center px-5 font-oswald">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
             <h2 className="text-4xl text-gray-800">FAQs</h2>
           </header>
diff --git a/src/client/routes/programs.tsx b/src/client/routes/programs.tsx
index df5e50a5..144a4425 100644
--- a/src/client/routes/programs.tsx
+++ b/src/client/routes/programs.tsx
@@ -10,16 +10,16 @@ import React from "react";
 export const Route = createFileRoute("/programs")({
   component: () => {
     return (
-      <div className="mt-12 flex min-h-screen flex-col items-center bg-white font-[Poppins]">
+      <div className="mt-12 flex min-h-screen flex-col items-center bg-white">
         <div className="w-full max-w-7xl px-4 py-8">
           <header className="mb-14 flex items-center px-5">
             <div className="mr-3 h-14 w-1.5 bg-saseGreen"></div>
-            <h2 className="rounded-sm text-5xl font-semibold text-gray-800">PROGRAMS</h2>
+            <h2 className="rounded-sm font-oswald text-5xl font-semibold text-gray-800">PROGRAMS</h2>
           </header>
           <BoardPicture />
           <header className="mb-6 flex items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
-            <h2 className="text-4xl text-gray-800">SASE Interns</h2>
+            <h2 className="font-oswald text-4xl text-gray-800">SASE Interns</h2>
           </header>
           <ProgramCard
             image={InternsCard}
@@ -34,7 +34,7 @@ export const Route = createFileRoute("/programs")({
           />
           <header className="mb-6 flex items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
-            <h2 className="text-4xl text-gray-800">Engineering Team (SET)</h2>
+            <h2 className="font-oswald text-4xl text-gray-800">Engineering Team (SET)</h2>
           </header>
           <ProgramCard
             image={SetCard}
@@ -49,7 +49,7 @@ export const Route = createFileRoute("/programs")({
           />
           <header className="mb-6 flex items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
-            <h2 className="text-4xl text-gray-800">Web Development Team</h2>
+            <h2 className="font-oswald text-4xl text-gray-800">Web Development Team</h2>
           </header>
           <ProgramCard
             image={WebDevCard}
@@ -64,7 +64,7 @@ export const Route = createFileRoute("/programs")({
           />
           <header className="mb-6 flex items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
-            <h2 className="text-4xl text-gray-800">SASE Sports</h2>
+            <h2 className="font-oswald text-4xl text-gray-800">SASE Sports</h2>
           </header>
           <ProgramCard
             image={SaseSportsCard}
diff --git a/src/client/routes/set.tsx b/src/client/routes/set.tsx
index 734cb332..cd2d38c1 100644
--- a/src/client/routes/set.tsx
+++ b/src/client/routes/set.tsx
@@ -1,9 +1,7 @@
-import SETPic from "@assets/set/SaseSet.png";
-import SETProj from "@assets/set/SetProject.png";
+import Carousel from "@/client/components/programs/Carousel";
 import FAQ from "@components/programs/FAQCard";
 import GoalCard from "@components/programs/GoalCard";
 import InfoCard from "@components/programs/InfoCard";
-import TestimonialCard from "@components/programs/TestimonialCard";
 import { createFileRoute } from "@tanstack/react-router";
 import { imageUrls } from "../assets/imageUrls";
 import { faqData } from "../components/programs/faqSet";
@@ -44,26 +42,13 @@ export const Route = createFileRoute("/set")({
             }
           />
         </div>
-        {/* Image Section */}
         <div className="w-full max-w-7xl px-4 py-8">
-          <div className="mx-auto mb-24 w-full max-w-7xl px-4">
-            <img
-              src={SETPic}
-              alt="SET Image"
-              className="w-full rounded-3xl border-4 border-saseGreen"
-              style={{ height: "600px", objectFit: "cover" }}
-            />
-          </div>
+          <Carousel purpose="Images" prog="SET" />
           <header className="mb-6 flex max-w-7xl items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
             <h2 className="text-4xl text-gray-800">Past Projects</h2>
           </header>
-          <TestimonialCard
-            image={SETProj}
-            text="Last year, SET successfully developed a campus cleaner robot designed to autonomously identify and pick up trash 🤖. This innovative project not only helped keep our campus clean but also provided valuable experience in robotics, programming, and teamwork."
-            name="SET Member"
-            title="2024 Project"
-          />
+          <Carousel purpose="Testimonials" prog="SET" />
           <header className="mb-12 flex max-w-7xl items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
             <h2 className="text-4xl text-gray-800">Goals & Outcomes</h2>
diff --git a/src/client/routes/sports.tsx b/src/client/routes/sports.tsx
index 42c1d66d..122d4c80 100644
--- a/src/client/routes/sports.tsx
+++ b/src/client/routes/sports.tsx
@@ -1,11 +1,9 @@
-import SportsPic from "@assets/sports/SaseSports.png";
-import SportsTestimony from "@assets/sports/SportsTestimonial.jpeg";
 import FAQ from "@components/programs/FAQCard";
 import GoalCard from "@components/programs/GoalCard";
 import InfoCard from "@components/programs/InfoCard";
-import TestimonialCard from "@components/programs/TestimonialCard";
 import { createFileRoute } from "@tanstack/react-router";
 import { imageUrls } from "../assets/imageUrls";
+import Carousel from "../components/programs/Carousel";
 import { faqData } from "../components/programs/faqSports";
 import { seo } from "../utils/seo";
 
@@ -41,26 +39,13 @@ export const Route = createFileRoute("/sports")({
             }
           />
         </div>
-        {/* Placeholder Image */}
         <div className="w-full max-w-7xl px-4 py-8">
-          <div className="mx-auto mb-24 w-full max-w-7xl px-4">
-            <img
-              src={SportsPic}
-              alt="SaseSports"
-              className="w-full rounded-3xl border-4 border-saseGreen"
-              style={{ height: "600px", objectFit: "cover" }}
-            />
-          </div>
+          <Carousel purpose="Images" prog="Sports" />
           <header className="mb-6 flex max-w-7xl items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
             <h2 className="text-4xl text-gray-800">Testimonials</h2>
           </header>
-          <TestimonialCard
-            image={SportsTestimony}
-            text="SASE sports is a fun way to connect with people while being active! I’m really glad I got to join and make friends while getting to play soccer again, and everyone is really nice to play with! We get to joke around and break a swear together, and I’ll cherish the memories and friends I made far beyond college."
-            name="Cameron McMullen"
-            title="2024 SASE Sports Member"
-          />
+          <Carousel purpose="Testimonials" prog="Sports" />
           <header className="mb-12 flex max-w-7xl items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
             <h2 className="text-4xl text-gray-800">Goals & Outcomes</h2>
diff --git a/src/client/routes/webdev.tsx b/src/client/routes/webdev.tsx
index 85768e98..2a923447 100644
--- a/src/client/routes/webdev.tsx
+++ b/src/client/routes/webdev.tsx
@@ -2,9 +2,9 @@ import BackendLead from "@assets/webdev/BackendLead.jpeg";
 import FrontEndLead from "@assets/webdev/FrontendLead.png";
 import FullStackLead from "@assets/webdev/FullStackLead2.jpg";
 import UIUXLead from "@assets/webdev/UIUXLead.jpg";
-import TeamPhoto from "@assets/webdev/WebDevTeam.jpg";
 import WebmasterChair from "@assets/webdev/WebmasterChair.jpeg";
 import MemberCard from "@components/home/MemberCard";
+import Carousel from "@components/programs/Carousel";
 import FAQ from "@components/programs/FAQCard";
 import { faqData } from "@components/programs/faqWebdev";
 import GoalCard from "@components/programs/GoalCard";
@@ -47,16 +47,8 @@ export const Route = createFileRoute("/webdev")({
             }
           />
         </div>
-        {/* Placeholder Image */}
         <div className="w-full max-w-7xl px-4 py-8">
-          <div className="mx-auto mb-24 w-full max-w-7xl px-4">
-            <img
-              src={TeamPhoto}
-              alt="Placeholder"
-              className="w-full rounded-3xl border-4 border-saseGreen"
-              style={{ height: "600px", objectFit: "cover" }}
-            />
-          </div>
+          <Carousel purpose="Images" prog="Web Dev" />
           <header className="mb-6 flex max-w-7xl items-center px-5">
             <div className="mr-3 h-11 w-1.5 bg-saseGreen"></div>
             <h2 className="text-4xl text-gray-800">Leadership</h2>