diff --git a/daily-thought-frontend/src/components/navigation/NavBar.tsx b/daily-thought-frontend/src/components/navigation/NavBar.tsx
index 452b85c3fbd5c856e11710161d1305a42abbd164..88b34623f1f5e50efd166372658c672bcce852b3 100644
--- a/daily-thought-frontend/src/components/navigation/NavBar.tsx
+++ b/daily-thought-frontend/src/components/navigation/NavBar.tsx
@@ -15,7 +15,6 @@ const navigation = [
 ]
 const userNavigation = [
   { name: 'Your Profile', href: '#' },
-  { name: 'Settings', href: '#' },
   { name: 'Sign out', href: '#' },
 ]
 
@@ -83,7 +82,14 @@ const NavBar: FC<PropsWithChildren<NavBarProps>> = ({
                           <div>
                             <Menu.Button className="flex max-w-xs items-center rounded-full bg-green-400 text-sm focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 focus:ring-offset-c-pink">
                               <span className="sr-only">Open user menu</span>
-                              <img className="h-8 w-8 rounded-full" src={user.Avatar} alt="" />
+                              {user.profile.length > 0 &&
+                                <img className="h-8 w-8 rounded-full" src={user.profile} alt="" />
+                              }
+
+                              {user.profile.length === 0 &&
+                                <p className='text text-white h-8 w-8 rounded-full flex justify-center items-center'>{user.username[0]}</p>
+                              }
+                              
                             </Menu.Button>
                           </div>
                           <Transition
@@ -154,11 +160,18 @@ const NavBar: FC<PropsWithChildren<NavBarProps>> = ({
                 <div className=" pt-4 pb-3 bg-c-pink ">
                   <div className="flex items-center px-5 bg-white mx-2 py-2 rounded-md">
                     <div className="flex-shrink-0">
-                      <img className="h-10 w-10 rounded-full" src={user?.Avatar} alt="" />
+                      {user && user.profile.length > 0 && 
+                        <img className="h-10 w-10 rounded-full" src={user?.profile} alt="" />
+                      }
+
+                      {user && user.profile.length === 0 &&
+                        <p className='h-10 w-10 rounded-full bg-c-green text-white flex items-center justify-center'>{user.username[0]}</p>
+                      }
+                      
                     </div>
                     <div className="ml-3">
-                      <div className="text-base font-medium leading-none text-grey-600">{user?.Name}</div>
-                      <div className="text-sm font-medium leading-none text-gray-400">{`@${user?.Username}`}</div>
+                      <div className="text-base font-medium leading-none text-grey-600">{user?.name}</div>
+                      <div className="text-sm font-medium leading-none text-gray-400">{`@${user?.username}`}</div>
                     </div>
                     <button
                       type="button"