diff --git a/src/components/user_avatar/user_avatar.js b/src/components/user_avatar/user_avatar.js
index 855ea60e8..8092ba62b 100644
--- a/src/components/user_avatar/user_avatar.js
+++ b/src/components/user_avatar/user_avatar.js
@@ -14,12 +14,31 @@ library.add(
 )
 
 const UserAvatar = {
-  props: [
-    'user',
-    'compact',
-    'showActorTypeIndicator',
-    'url'
-  ],
+  props: {
+    // User object to show avatar of
+    user: {
+      required: true,
+      type: Object
+    },
+    // Use less space and use alternative roundness
+    compact: {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Show small icon indicating if account is a bot or group
+    showActorTypeIndicator : {
+      required: false,
+      type: Boolean,
+      default: false
+    },
+    // Override avatar image URL, useful for profile editing
+    url: {
+      required: false,
+      type: String,
+      default: null
+    }
+  },
   data () {
     return {
       showPlaceholder: false,
diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue
index e3398165c..c0336d407 100644
--- a/src/components/user_avatar/user_avatar.vue
+++ b/src/components/user_avatar/user_avatar.vue
@@ -40,12 +40,12 @@
 
   display: inline-block;
   position: relative;
-  width: 48px;
+  width: 3.5em;
   height: 48px;
 
   &.-compact {
-    width: 32px;
-    height: 32px;
+    width: 2.2em;
+    height: 2.2em;
     border-radius: var(--roundness);
   }