diff --git a/code/frontend/src/components/ChangeAvatarDialog.tsx b/code/frontend/src/components/ChangeAvatarDialog.tsx
index 6235fe6..cce78e9 100644
--- a/code/frontend/src/components/ChangeAvatarDialog.tsx
+++ b/code/frontend/src/components/ChangeAvatarDialog.tsx
@@ -13,13 +13,12 @@ import {
 } from "@mui/material";
 import CloseIcon from "@mui/icons-material/Close";
 import EditSquareIcon from "@mui/icons-material/EditSquare";
-import "../styles/colors.css";
-import "../styles/fonts.css";
 import "./changeAvatarDialog.css";
 import ButtonRotkehlchen from "./ButtonRotkehlchen";
 import { useFilePicker } from "use-file-picker";
 import Username from "./Username";
-import "./username.css"
+import "./username.css";
+import api from "../api/axios";
 
 const BootstrapDialog = styled(Dialog)(({ theme }) => ({
   "& .MuiDialogContent-root": {
@@ -37,6 +36,26 @@ export default function AvatarDialog({
   ownAccount: boolean;
   username: string;
 }) {
+  const [profilePicture, setProfilePicture] = React.useState<string | null>(
+    null
+  );
+
+  const saveProfilePicture = async () => {
+    try {
+      const response = await api.post("/profile/updateProfilePicture", {
+        profilePicture: profilePicture,
+      });
+      setProfilePicture(response.data.data.profilePicture);
+      console.log(
+        "Profile picture saved successfully:",
+        response.data.data.profilePicture
+      );
+      setOpen(false); // Close the dialog after saving
+    } catch (error) {
+      console.error("Error saving profile picture:", error);
+    }
+  };
+
   const { openFilePicker, filesContent, loading, clear } = useFilePicker({
     accept: ".png, .jpg, .jpeg",
     multiple: false,
@@ -61,9 +80,6 @@ export default function AvatarDialog({
     clear(); // Reset the selected image when closing
     setOpen(false);
   };
-  const handleSaveChanges = () => {
-    setOpen(false);
-  };
 
   return (
     <React.Fragment>
@@ -154,7 +170,7 @@ export default function AvatarDialog({
                   style="primary"
                   label="Save Changes"
                   type="submit"
-                  onClick={handleSaveChanges}
+                  onClick={saveProfilePicture}
                 />
                 <ButtonRotkehlchen
                   style="secondary"
diff --git a/code/frontend/src/components/QuiltedImageList.tsx b/code/frontend/src/components/QuiltedImageList.tsx
index 90f1c2d..5a976ca 100644
--- a/code/frontend/src/components/QuiltedImageList.tsx
+++ b/code/frontend/src/components/QuiltedImageList.tsx
@@ -2,8 +2,33 @@ import ImageListItem from "@mui/material/ImageListItem";
 import { StyledEngineProvider } from "@mui/material/styles";
 import "./quiltedImageList.css";
 import { Box, Grid } from "@mui/material";
+import api from "../api/axios";
+import { useState } from "react";
+import { UserProfile } from "../types/UserProfile";
+import { useNavigate } from "react-router-dom";
+
+export default function StandardImageList({user} : {user: UserProfile}) {
+
+  const navigate = useNavigate();
+  const [itemData, setData] = useState<{ img: string; title: string }[]>([]);
+
+  const fetchUserPosts = async () => {
+    try {
+      const response = await api.get(`/profile/posts/${user.username}`);
+      const posts = response.data.data;
+      const images = posts.map((post: { imageUrl: string; title: string }) => ({
+        img: post.imageUrl,
+        title: post.title,
+      }));
+      setData(images);
+    } catch (error) {
+      console.error("Error fetching user posts:", error);
+    }
+  };
+
+  fetchUserPosts().then(console.log);
+
 
-export default function StandardImageList() {
   return (
     <StyledEngineProvider injectFirst>
       <Box className="box">
@@ -15,8 +40,9 @@ export default function StandardImageList() {
                 src={`${item.img}?w=164&h=164&fit=crop&auto=format`}
                 alt={item.title}
                 onClick={() =>
-                  console.log(item.title)
-                } /* change to onClick => Feed*/
+                  navigate("/feed", { replace: true })
+                  // anchor to post that was clicked
+                }
                 loading="lazy"
               />
             </ImageListItem>
@@ -27,348 +53,3 @@ export default function StandardImageList() {
   );
 }
 
-const itemData = [
-  { img: "/assets/images/BirdLogin.jpg", title: "Bird" },
-  { img: "../../assets/images/BirdsSky.jpg", title: "Bird Sky" },
-  { img: "../../assets/images/evening.jpg", title: "Evening" },
-  { img: "../../assets/images/PortraitForestAndStreet.jpg", title: "Forest" },
-  { img: "../../assets/images/IceBirdLogin.jpg", title: "Ice Bird" },
-  { img: "../../assets/images/SummerOwlSignup.jpg", title: "Summer Owl" },
-
-  {
-    img: "https://images.unsplash.com/photo-1551963831-b3b1ca40c98e",
-    title: "Breakfast",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551782450-a2132b4ba21d",
-    title: "Burger",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1522770179533-24471fcdba45",
-    title: "Camera",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1444418776041-9c7e33cc5a9c",
-    title: "Coffee",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1533827432537-70133748f5c8",
-    title: "Hats",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1558642452-9d2a7deb7f62",
-    title: "Honey",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1516802273409-68526ee1bdd6",
-    title: "Basketball",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1518756131217-31eb79b20e8f",
-    title: "Fern",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1597645587822-e99fa5d45d25",
-    title: "Mushrooms",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1567306301408-9b74779a11af",
-    title: "Tomato basil",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1471357674240-e1a485acb3e1",
-    title: "Sea star",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1589118949245-7d38baf380d6",
-    title: "Bike",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551963831-b3b1ca40c98e",
-    title: "Breakfast",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551782450-a2132b4ba21d",
-    title: "Burger",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1522770179533-24471fcdba45",
-    title: "Camera",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1444418776041-9c7e33cc5a9c",
-    title: "Coffee",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1533827432537-70133748f5c8",
-    title: "Hats",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1558642452-9d2a7deb7f62",
-    title: "Honey",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1516802273409-68526ee1bdd6",
-    title: "Basketball",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1518756131217-31eb79b20e8f",
-    title: "Fern",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1597645587822-e99fa5d45d25",
-    title: "Mushrooms",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1567306301408-9b74779a11af",
-    title: "Tomato basil",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1471357674240-e1a485acb3e1",
-    title: "Sea star",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1589118949245-7d38baf380d6",
-    title: "Bike",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551963831-b3b1ca40c98e",
-    title: "Breakfast",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551782450-a2132b4ba21d",
-    title: "Burger",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1522770179533-24471fcdba45",
-    title: "Camera",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1444418776041-9c7e33cc5a9c",
-    title: "Coffee",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1533827432537-70133748f5c8",
-    title: "Hats",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1558642452-9d2a7deb7f62",
-    title: "Honey",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1516802273409-68526ee1bdd6",
-    title: "Basketball",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1518756131217-31eb79b20e8f",
-    title: "Fern",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1597645587822-e99fa5d45d25",
-    title: "Mushrooms",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1567306301408-9b74779a11af",
-    title: "Tomato basil",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1471357674240-e1a485acb3e1",
-    title: "Sea star",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1589118949245-7d38baf380d6",
-    title: "Bike",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551963831-b3b1ca40c98e",
-    title: "Breakfast",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551782450-a2132b4ba21d",
-    title: "Burger",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1522770179533-24471fcdba45",
-    title: "Camera",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1444418776041-9c7e33cc5a9c",
-    title: "Coffee",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1533827432537-70133748f5c8",
-    title: "Hats",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1558642452-9d2a7deb7f62",
-    title: "Honey",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1516802273409-68526ee1bdd6",
-    title: "Basketball",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1518756131217-31eb79b20e8f",
-    title: "Fern",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1597645587822-e99fa5d45d25",
-    title: "Mushrooms",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1567306301408-9b74779a11af",
-    title: "Tomato basil",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1471357674240-e1a485acb3e1",
-    title: "Sea star",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1589118949245-7d38baf380d6",
-    title: "Bike",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551963831-b3b1ca40c98e",
-    title: "Breakfast",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551782450-a2132b4ba21d",
-    title: "Burger",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1522770179533-24471fcdba45",
-    title: "Camera",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1444418776041-9c7e33cc5a9c",
-    title: "Coffee",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1533827432537-70133748f5c8",
-    title: "Hats",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1558642452-9d2a7deb7f62",
-    title: "Honey",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1516802273409-68526ee1bdd6",
-    title: "Basketball",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1518756131217-31eb79b20e8f",
-    title: "Fern",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1597645587822-e99fa5d45d25",
-    title: "Mushrooms",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1567306301408-9b74779a11af",
-    title: "Tomato basil",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1471357674240-e1a485acb3e1",
-    title: "Sea star",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1589118949245-7d38baf380d6",
-    title: "Bike",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551963831-b3b1ca40c98e",
-    title: "Breakfast",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551782450-a2132b4ba21d",
-    title: "Burger",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1522770179533-24471fcdba45",
-    title: "Camera",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1444418776041-9c7e33cc5a9c",
-    title: "Coffee",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1533827432537-70133748f5c8",
-    title: "Hats",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1558642452-9d2a7deb7f62",
-    title: "Honey",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1516802273409-68526ee1bdd6",
-    title: "Basketball",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1518756131217-31eb79b20e8f",
-    title: "Fern",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1597645587822-e99fa5d45d25",
-    title: "Mushrooms",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1567306301408-9b74779a11af",
-    title: "Tomato basil",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1471357674240-e1a485acb3e1",
-    title: "Sea star",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1589118949245-7d38baf380d6",
-    title: "Bike",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551963831-b3b1ca40c98e",
-    title: "Breakfast",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1551782450-a2132b4ba21d",
-    title: "Burger",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1522770179533-24471fcdba45",
-    title: "Camera",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1444418776041-9c7e33cc5a9c",
-    title: "Coffee",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1533827432537-70133748f5c8",
-    title: "Hats",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1558642452-9d2a7deb7f62",
-    title: "Honey",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1516802273409-68526ee1bdd6",
-    title: "Basketball",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1518756131217-31eb79b20e8f",
-    title: "Fern",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1597645587822-e99fa5d45d25",
-    title: "Mushrooms",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1567306301408-9b74779a11af",
-    title: "Tomato basil",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1471357674240-e1a485acb3e1",
-    title: "Sea star",
-  },
-  {
-    img: "https://images.unsplash.com/photo-1589118949245-7d38baf380d6",
-    title: "Bike",
-  },
-];
diff --git a/code/frontend/src/components/changeAvatarDialog.css b/code/frontend/src/components/changeAvatarDialog.css
index b33aa72..99fe5cc 100644
--- a/code/frontend/src/components/changeAvatarDialog.css
+++ b/code/frontend/src/components/changeAvatarDialog.css
@@ -32,11 +32,10 @@
 
 .user {
   display: inline-flex;
-  width: fit-content;
+  width: 100%;
   align-items: center;
-  justify-content: center;
+  justify-content: start;
   gap: 20px;
-  padding-bottom: 1rem;
   margin-top: 1rem;
   border-radius: 1rem;
 }
@@ -49,9 +48,8 @@
   }
 
   .user {
-    width: fit-content;
     padding-left: 1rem;
-    padding-right: 3rem;
+    padding-right: 1rem;
     padding-bottom: 1rem;
   }
 }
diff --git a/code/frontend/src/pages/Profile.tsx b/code/frontend/src/pages/Profile.tsx
index 1575f57..3ab45f9 100644
--- a/code/frontend/src/pages/Profile.tsx
+++ b/code/frontend/src/pages/Profile.tsx
@@ -12,16 +12,7 @@ import api from "../api/axios";
 import { useAuth } from "../api/Auth";
 import { useNavigate, useParams } from "react-router-dom";
 import { useEffect, useState } from "react";
-
-type UserProfile = {
-  id: string;
-  username: string;
-  bio: string | undefined;
-  profilePictureUrl: string | null;
-  followers: number;
-  following: number;
-  // posts: number;
-}
+import { UserProfile } from "../types/UserProfile";
 
 function Profile() {
   const { user } = useAuth();
@@ -88,7 +79,7 @@ const setBio = (bio: string) => {
           </div>
           <RotkehlchenButton style="primary" label="Follow" type="button" />
         </div>
-        <QuiltedImageList />
+        {userData && <QuiltedImageList user={userData} />}
       </div>
     </StyledEngineProvider>
   );
diff --git a/code/frontend/src/pages/profile.css b/code/frontend/src/pages/profile.css
index adc7970..8920eed 100644
--- a/code/frontend/src/pages/profile.css
+++ b/code/frontend/src/pages/profile.css
@@ -1,5 +1,6 @@
 .profile-display {
   padding-top: calc(var(--Header-height) + 1rem);
+  min-height: 100vh;
 }
 
 .user-info {
diff --git a/code/frontend/src/types/UserProfile.ts b/code/frontend/src/types/UserProfile.ts
new file mode 100644
index 0000000..93d5f79
--- /dev/null
+++ b/code/frontend/src/types/UserProfile.ts
@@ -0,0 +1,9 @@
+export type UserProfile = {
+    id: string;
+    username: string;
+    bio: string | undefined;
+    profilePictureUrl: string | null;
+    followers: number;
+    following: number;
+    // posts: number;
+  }
\ No newline at end of file