diff --git a/frontend/src/components/overlays/Settings.svelte b/frontend/src/components/overlays/Settings.svelte
index 7931318..749d10f 100644
--- a/frontend/src/components/overlays/Settings.svelte
+++ b/frontend/src/components/overlays/Settings.svelte
@@ -2,7 +2,7 @@
     import { overlayStore, userInfoStore, smallViewport, theme, doAnimations, OverlayType, sendTypingUpdatesItemStore } from "../../stores";
     import { logOut } from "../../auth";
     import { maybeModalFade, maybeModalScale } from "../../animations";
-    import request, { methods, remoteBlobUpload } from "../../request";
+    import request, { getErrorFromResponse, methods, remoteBlobUpload, responseOk } from "../../request";
     import { apiRoute, getItem } from "../../storage";
     import UserView from "../UserView.svelte";
     import ChipBar from "../ChipBar.svelte";
@@ -55,11 +55,13 @@
         if (!avatarFileInput || !avatarFileInput.files || !avatarFileInput.files[0]) return;
         
         const file = avatarFileInput.files[0];
-        const { ok } = await remoteBlobUpload(methods.putUserAvatar, file);
-        if (ok) {
+        const res = await remoteBlobUpload(methods.putUserAvatar, file);
+        if (responseOk(res)) {
             overlayStore.toast("Your avatar has been updated");
         } else {
-            overlayStore.toast("Failed to upload avatar");
+            const error = getErrorFromResponse(res);
+            const message = error.validationErrors && error.validationErrors.length ? error.validationErrors[0].msg : error.message;
+            overlayStore.toast(`Failed to upload avatar: ${message}`);
         }
     };