diff --git a/client/src/components/Navbar.css b/client/src/components/Navbar.css
index d024be8..91d784f 100644
--- a/client/src/components/Navbar.css
+++ b/client/src/components/Navbar.css
@@ -1,7 +1,3 @@
-.navbar{
-
-}
-
 .navbar .searchbar {
   display: flex;
   flex-direction: row;
@@ -17,4 +13,13 @@
 
 .profile-settings svg{
   margin: 10px;
+}
+
+.profile-avatar-name {
+  align-items: center;
+}
+
+.profile-avatar-name img{
+  height: 30px;
+  border-radius: 20px;
 }
\ No newline at end of file
diff --git a/client/src/components/Navbar.js b/client/src/components/Navbar.js
index 16c9ec1..4446a95 100644
--- a/client/src/components/Navbar.js
+++ b/client/src/components/Navbar.js
@@ -14,7 +14,11 @@ function Navbar(props) {
               </IconContext.Provider>
               <input placeholder="Search everything..."/>
             </div>
-            <div className="profile-settings">
+            <div className="profile-settings d-flex">
+              <div className="profile-avatar-name d-flex">
+                <img src="https://picsum.photos/30/30" alt="avatar"/>
+                <span>dcoder</span>
+              </div>
               <FiCheck />
               <FiUsers />
               <FiBell />