diff --git a/web/avatars/avatar-hooks.react.js b/web/avatars/avatar-hooks.react.js
new file mode 100644
--- /dev/null
+++ b/web/avatars/avatar-hooks.react.js
@@ -0,0 +1,32 @@
+// @flow
+
+import * as React from 'react';
+
+import { uploadMultimedia } from 'lib/actions/upload-actions.js';
+import type { UploadMultimediaResult } from 'lib/types/media-types.js';
+import { useServerCall } from 'lib/utils/action-utils.js';
+
+import { validateFile } from '../media/media-utils.js';
+
+function useUploadAvatarMedia(): File => Promise<UploadMultimediaResult> {
+  const callUploadMultimedia = useServerCall(uploadMultimedia);
+  const uploadAvatarMedia = React.useCallback(
+    async (file: File): Promise<UploadMultimediaResult> => {
+      const validatedFile = await validateFile(file);
+      const { result } = validatedFile;
+      if (!result.success) {
+        throw new Error('Avatar media validation failed.');
+      }
+      const { file: fixedFile, dimensions } = result;
+      const uploadExtras = {
+        ...dimensions,
+        loop: false,
+      };
+      return await callUploadMultimedia(fixedFile, uploadExtras);
+    },
+    [callUploadMultimedia],
+  );
+  return uploadAvatarMedia;
+}
+
+export { useUploadAvatarMedia };
diff --git a/web/avatars/edit-user-avatar-menu.react.js b/web/avatars/edit-user-avatar-menu.react.js
--- a/web/avatars/edit-user-avatar-menu.react.js
+++ b/web/avatars/edit-user-avatar-menu.react.js
@@ -9,6 +9,7 @@
 import { useENSAvatar } from 'lib/hooks/ens-cache.js';
 import { getETHAddressForUserInfo } from 'lib/shared/account-utils.js';
 
+import { useUploadAvatarMedia } from './avatar-hooks.react.js';
 import css from './edit-user-avatar-menu.css';
 import EmojiAvatarSelectionModal from './emoji-avatar-selection-modal.react.js';
 import CommIcon from '../CommIcon.react.js';
@@ -66,9 +67,10 @@
     [],
   );
 
+  const uploadAvatarMedia = useUploadAvatarMedia();
   const onImageSelected = React.useCallback(
-    event => console.log(event.target.files),
-    [],
+    event => uploadAvatarMedia(event.target.files[0]),
+    [uploadAvatarMedia],
   );
 
   const imageMenuItem = React.useMemo(