diff --git a/src/assets/css/_variables.scss b/src/assets/css/_variables.scss
index bb3aa64..ea510aa 100644
--- a/src/assets/css/_variables.scss
+++ b/src/assets/css/_variables.scss
@@ -4,6 +4,7 @@ $app-background: #f6f6f6;
 $main-desktop-width: 900px;
 $dialog-desktop-width: 940px;
 $very-very-purple: #536dfe;
+$lighter-gray: #FDFBF9;
 
 $chat-background: $background;
 $chat-standard-padding: 32px;
diff --git a/src/assets/css/chat.scss b/src/assets/css/chat.scss
index 0e7541e..7a9d668 100644
--- a/src/assets/css/chat.scss
+++ b/src/assets/css/chat.scss
@@ -911,7 +911,7 @@ body {
 }
 
 .room-info {
-  background-color: #FDFBF9;
+  background-color: $lighter-gray;
   height: 100%;
 
   .chat-header {
@@ -1090,7 +1090,7 @@ body {
 }
 
 .profile {
-  background-color: #e8e8e8;
+  background-color: $lighter-gray;
   height: 100%;
   .chat-header {
     background-color: transparent;
@@ -1100,6 +1100,7 @@ body {
   .v-card {
     background-color: white;
     border-radius: 20px;
+    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.05) !important;
   }
 
   .user-info {
diff --git a/src/components/UserProfileDialog.vue b/src/components/UserProfileDialog.vue
index 6c8e316..deaf0ed 100644
--- a/src/components/UserProfileDialog.vue
+++ b/src/components/UserProfileDialog.vue
@@ -7,7 +7,7 @@
     :width="$vuetify.breakpoint.smAndUp ? '688px' : '95%'"
   >
     <div class="dialog-content text-center member-action-dialog">
-      <div>
+      <div class="pt-4">
         <v-avatar class="avatar" size="56" color="grey">
           <img v-if="memberAvatarComp" :src="memberAvatarComp" />
           <span v-else class="white--text headline">{{ firstLetterUserName }}</span>