diff --git a/frontend/src/app/album/page.tsx b/frontend/src/app/album/page.tsx
index 88afd53..a3e31b3 100644
--- a/frontend/src/app/album/page.tsx
+++ b/frontend/src/app/album/page.tsx
@@ -21,7 +21,7 @@ export default function Page() {
   useEffect(() => {
     async function fetchAlbums() {
       try {
-        const response = getAlbums();
+        const response = await getAlbums();
         const data = await response.json();
         setAlbums(data);
       } catch (error) {
@@ -37,8 +37,8 @@ export default function Page() {
 
     const formData = new FormData(event.currentTarget);
     try {
-      const response = createAlbum(formData);
-      const data = response.json();
+      const response = await createAlbum(formData);
+      const data = await response.json();
       console.log(data);
     } catch (error) {
       console.error("Error creating Album: ", error);
@@ -76,7 +76,7 @@ export default function Page() {
     <>
     <div className="container">
       <IconButton aria-label="Add Album" size="large" onClick={handleCreate}>
-        <AddCircleOutline fontSize="inherit" />
+        <AddCircleOutline fontSize="inherit" color="success"/>
       </IconButton>
       <table className="u-full-width">
         <thead>
@@ -105,10 +105,10 @@ export default function Page() {
             </td>
             <td>
               <IconButton aria-label="Edit Album" size="small" id={album.id.toString()} onClick={handleEdit}>
-                <Edit fontSize="inherit" />
+                <Edit fontSize="inherit" color="success"/>
               </IconButton>
               <IconButton aria-label="Delete Album" size="small" id={album.id.toString()} onClick={handleEdit}>
-                <Delete fontSize="inherit" />
+                <Delete fontSize="inherit" color="success"/>
               </IconButton>
             </td>
           </tr>