diff --git a/ui/src/components/user.tsx b/ui/src/components/user.tsx
index 30ee3dc..c95b18b 100644
--- a/ui/src/components/user.tsx
+++ b/ui/src/components/user.tsx
@@ -130,14 +130,7 @@ export class User extends Component<any, UserState> {
     this.state.username = this.props.match.params.username;
 
     this.subscription = WebSocketService.Instance.subject
-      .pipe(
-        retryWhen(errors =>
-          errors.pipe(
-            delay(3000),
-            take(10)
-          )
-        )
-      )
+      .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
       .subscribe(
         msg => this.parseMessage(msg),
         err => console.error(err),
@@ -449,16 +442,18 @@ export class User extends Component<any, UserState> {
                     htmlFor="file-upload"
                     class="pointer ml-4 text-muted small font-weight-bold"
                   >
-                    <img
-                      height="80"
-                      width="80"
-                      src={
-                        this.state.userSettingsForm.avatar
-                          ? this.state.userSettingsForm.avatar
-                          : 'https://via.placeholder.com/300/000?text=Avatar'
-                      }
-                      class="rounded-circle"
-                    />
+                    {!this.state.userSettingsForm.avatar ? (
+                      <span class="btn btn-sm btn-secondary">
+                        <T i18nKey="upload_avatar">#</T>
+                      </span>
+                    ) : (
+                      <img
+                        height="80"
+                        width="80"
+                        src={this.state.userSettingsForm.avatar}
+                        class="rounded-circle"
+                      />
+                    )}
                   </label>
                   <input
                     id="file-upload"
diff --git a/ui/src/translations/en.ts b/ui/src/translations/en.ts
index bd7e39c..f218402 100644
--- a/ui/src/translations/en.ts
+++ b/ui/src/translations/en.ts
@@ -29,6 +29,7 @@ export const en = {
     preview: 'Preview',
     upload_image: 'upload image',
     avatar: 'Avatar',
+    upload_avatar: 'Upload Avatar',
     show_avatars: 'Show Avatars',
     formatting_help: 'formatting help',
     view_source: 'view source',