diff --git a/public/images/pfp_transparent_square.png b/public/images/pfp_transparent_square.webp
similarity index 100%
rename from public/images/pfp_transparent_square.png
rename to public/images/pfp_transparent_square.webp
diff --git a/src/components/Intro.svelte b/src/components/Intro.svelte
index 7fc4105..2522925 100644
--- a/src/components/Intro.svelte
+++ b/src/components/Intro.svelte
@@ -98,9 +98,10 @@
         <div class="flex flex-row h-20">
             <div class="w-20 mr-1 flex justify-center items-center">
                 <img
-                    src="/images/pfp_transparent_square.png"
+                    src="/images/pfp_transparent_square.webp"
                     alt="Ryan"
                     width="100"
+                    height="100"
                     class="rounded-full max-w-full bg-[#505050]"
                 />
             </div>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 5eee6a5..b200f33 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -26,7 +26,7 @@ import Card from "../components/Card.astro";
         <WhatIDo />
     </div>
     <div id="projects">
-        <Projects client:idle />
+        <Projects client:visible />
     </div>
     <div id="skills">
         <Skills />