diff --git a/web/modals/threads/members/change-member-role-modal.css b/web/modals/threads/members/change-member-role-modal.css
new file mode 100644
--- /dev/null
+++ b/web/modals/threads/members/change-member-role-modal.css
@@ -0,0 +1,29 @@
+.roleModalDescription {
+  color: var(--change-member-role-modal-description-text);
+  padding: 16px 32px 0 32px;
+  font-size: medium;
+  line-height: 1.5;
+}
+
+.roleModalMember {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-top: 24px;
+}
+
+.roleModalMemberAvatar {
+  margin-right: 4px;
+}
+
+.roleModalMemberName {
+  margin-left: 4px;
+  font-size: large;
+  color: var(--change-member-role-modal-generic-text);
+}
+
+.roleModalRoleSelector {
+  display: flex;
+  justify-content: center;
+  padding: 20px;
+}
diff --git a/web/modals/threads/members/change-member-role-modal.react.js b/web/modals/threads/members/change-member-role-modal.react.js
new file mode 100644
--- /dev/null
+++ b/web/modals/threads/members/change-member-role-modal.react.js
@@ -0,0 +1,37 @@
+// @flow
+
+import * as React from 'react';
+
+import { useModalContext } from 'lib/components/modal-provider.react.js';
+import type { RelativeMemberInfo, ThreadInfo } from 'lib/types/thread-types';
+
+import css from './change-member-role-modal.css';
+import UserAvatar from '../../../components/user-avatar.react.js';
+import Modal from '../../modal.react.js';
+
+type ChangeMemberRoleModalProps = {
+  +memberInfo: RelativeMemberInfo,
+  +threadInfo: ThreadInfo,
+};
+
+function ChangeMemberRoleModal(props: ChangeMemberRoleModalProps): React.Node {
+  const { memberInfo } = props;
+  const { popModal } = useModalContext();
+
+  return (
+    <Modal name="Change Role" onClose={popModal} size="large">
+      <div className={css.roleModalDescription}>
+        Members can only be assigned to one role at a time. Changing a
+        member&rsquo;s role will replace their previously assigned role.
+      </div>
+      <div className={css.roleModalMember}>
+        <div className={css.roleModalMemberAvatar}>
+          <UserAvatar userID={memberInfo.id} size="large" />
+        </div>
+        <div className={css.roleModalMemberName}>{memberInfo.username}</div>
+      </div>
+    </Modal>
+  );
+}
+
+export default ChangeMemberRoleModal;
diff --git a/web/modals/threads/members/member.react.js b/web/modals/threads/members/member.react.js
--- a/web/modals/threads/members/member.react.js
+++ b/web/modals/threads/members/member.react.js
@@ -4,6 +4,7 @@
 import * as React from 'react';
 
 import { removeUsersFromThread } from 'lib/actions/thread-actions.js';
+import { useModalContext } from 'lib/components/modal-provider.react.js';
 import SWMansionIcon from 'lib/components/SWMansionIcon.react.js';
 import {
   removeMemberFromThread,
@@ -20,6 +21,7 @@
   useServerCall,
 } from 'lib/utils/action-utils.js';
 
+import ChangeMemberRoleModal from './change-member-role-modal.react.js';
 import css from './members-modal.css';
 import Label from '../../../components/label.react.js';
 import MenuItem from '../../../components/menu-item.react.js';
@@ -35,6 +37,7 @@
 
 function ThreadMember(props: Props): React.Node {
   const { memberInfo, threadInfo, setOpenMenu, isMenuOpen } = props;
+  const { pushModal } = useModalContext();
   const userName = stringForUser(memberInfo);
   const { roles } = threadInfo;
   const { role } = memberInfo;
@@ -64,7 +67,11 @@
     [boundRemoveUsersFromThread, dispatchActionPromise, memberInfo, threadInfo],
   );
 
-  const onClickChangeRole = React.useCallback(() => {}, []);
+  const onClickChangeRole = React.useCallback(() => {
+    pushModal(
+      <ChangeMemberRoleModal memberInfo={memberInfo} threadInfo={threadInfo} />,
+    );
+  }, [memberInfo, pushModal, threadInfo]);
 
   const menuItems = React.useMemo(
     () =>
diff --git a/web/theme.css b/web/theme.css
--- a/web/theme.css
+++ b/web/theme.css
@@ -232,4 +232,6 @@
   --dropdown-option-hover-bg: var(--shades-black-70);
   --dropdown-selected-option-check-color: var(--violet-dark-100);
   --dropdown-disabled-color: var(--shades-black-60);
+  --change-member-role-modal-description-text: var(--shades-white-60);
+  --change-member-role-modal-generic-text: var(--shades-white-100);
 }