diff --git a/src/components/Photo.astro b/src/components/Photo.astro
index f6adaab..8dfb6c5 100644
--- a/src/components/Photo.astro
+++ b/src/components/Photo.astro
@@ -3,16 +3,19 @@ import { Image } from "astro:assets";
 
 interface Props {
   photo: any;
+  width?: number;
+  height?: number;
   class?: string;
 }
 
-const { photo, class: className } = Astro.props;
+const { photo, width, height, class: className } = Astro.props;
 ---
 
 <Image
   src={photo}
   alt=""
-  height={1000}
+  {width}
+  {height}
   densities={[1, 2]}
   quality="mid"
   class={"object-contain rounded " + (className ?? "")}
diff --git a/src/pages/photography/[photo].astro b/src/pages/photography/[photo].astro
index c3f7a7d..508a0e5 100644
--- a/src/pages/photography/[photo].astro
+++ b/src/pages/photography/[photo].astro
@@ -27,6 +27,6 @@ const { photo } = Astro.props;
     history.back()
     "
   >
-    <Photo photo={photo.default} class="w-auto" />
+    <Photo photo={photo.default} height={1000} class="w-auto h-full" />
   </div>
 </RootLayout>
diff --git a/src/pages/photography/index.astro b/src/pages/photography/index.astro
index 1a34992..90dc7c8 100644
--- a/src/pages/photography/index.astro
+++ b/src/pages/photography/index.astro
@@ -48,7 +48,7 @@ export const getFileNameFromPath = (path: string) => {
           class="flex w-full py-2 duration-100 hover:-translate-y-1 rounded-lg"
         >
           <div class="bg-gray-200 rounded">
-            <Photo photo={photo.default} />
+            <Photo photo={photo.default} width={400} />
           </div>
         </a>
       ))