diff --git a/external/lang b/external/lang
index ab87bdcf15d60cfb6f3bd52af445456e5fd23e5f..f3c991242044c0125111e533a94350633a681d62 160000
--- a/external/lang
+++ b/external/lang
@@ -1 +1 @@
-Subproject commit ab87bdcf15d60cfb6f3bd52af445456e5fd23e5f
+Subproject commit f3c991242044c0125111e533a94350633a681d62
diff --git a/package.json b/package.json
index 4a44f8bec988c958d43fd6902ae5dd322e8979a8..25a456256b7e3db763123fe95d9b7085320bb595 100644
--- a/package.json
+++ b/package.json
@@ -94,7 +94,7 @@
     "react-router-dom": "^5.2.0",
     "react-scroll": "^1.8.2",
     "redux": "^4.1.0",
-    "revolt.js": "^4.3.3-alpha.18",
+    "revolt.js": "^4.3.3-alpha.19",
     "rimraf": "^3.0.2",
     "sass": "^1.35.1",
     "shade-blend-color": "^1.0.0",
diff --git a/src/components/common/AutoComplete.tsx b/src/components/common/AutoComplete.tsx
index 8793d561fd0c8b5752cba5590bbfb4178f1f89dd..966894f70718b645a1d4e35b0d7e96ce13767281 100644
--- a/src/components/common/AutoComplete.tsx
+++ b/src/components/common/AutoComplete.tsx
@@ -144,7 +144,7 @@ export function useAutoComplete(
                                 break;
                             case "TextChannel":
                                 const server = channel.server;
-                                users = client.servers.members
+                                users = client.members
                                     .toArray()
                                     .filter(
                                         (x) => x._id.substr(0, 26) === server,
diff --git a/src/components/common/user/UserShort.tsx b/src/components/common/user/UserShort.tsx
index cd83a41a3d6acb61e34436cfa18d9e7df81c86b9..3572f015301bb67774bce65466954cbe8cfcfa92 100644
--- a/src/components/common/user/UserShort.tsx
+++ b/src/components/common/user/UserShort.tsx
@@ -1,16 +1,51 @@
+import { useParams } from "react-router-dom";
 import { User } from "revolt.js";
 
 import { Text } from "preact-i18n";
 
+import {
+    useForceUpdate,
+    useMember,
+    useServer,
+} from "../../../context/revoltjs/hooks";
+
 import UserIcon from "./UserIcon";
 
 export function Username({
     user,
     ...otherProps
 }: { user?: User } & JSX.HTMLAttributes<HTMLElement>) {
+    let username = user?.username;
+    let color;
+
+    // ! this must be really bad for perf.
+    if (user) {
+        let { server } = useParams<{ server?: string }>();
+        if (server) {
+            let ctx = useForceUpdate();
+            let member = useMember(`${server}${user._id}`, ctx);
+            if (member) {
+                if (member.nickname) {
+                    username = member.nickname;
+                }
+
+                if (member.roles && member.roles.length > 0) {
+                    let s = useServer(server, ctx);
+                    for (let role of member.roles) {
+                        let c = s?.roles?.[role].colour;
+                        if (c) {
+                            color = c;
+                            continue;
+                        }
+                    }
+                }
+            }
+        }
+    }
+
     return (
-        <span {...otherProps}>
-            {user?.username ?? <Text id="app.main.channel.unknown_user" />}
+        <span {...otherProps} style={{ color }}>
+            {username ?? <Text id="app.main.channel.unknown_user" />}
         </span>
     );
 }
diff --git a/src/components/navigation/items/ButtonItem.tsx b/src/components/navigation/items/ButtonItem.tsx
index 4d841a239ffb89241b17368cda01db8dcff9ab8e..5fdd63ff745953301d231acbf7c06a01ff282933 100644
--- a/src/components/navigation/items/ButtonItem.tsx
+++ b/src/components/navigation/items/ButtonItem.tsx
@@ -14,6 +14,7 @@ import { useIntermediate } from "../../../context/intermediate/Intermediate";
 import ChannelIcon from "../../common/ChannelIcon";
 import Tooltip from "../../common/Tooltip";
 import UserIcon from "../../common/user/UserIcon";
+import { Username } from "../../common/user/UserShort";
 import UserStatus from "../../common/user/UserStatus";
 import IconButton from "../../ui/IconButton";
 
@@ -63,7 +64,9 @@ export function UserButton(props: UserProps) {
                 status
             />
             <div className={styles.name}>
-                <div>{user.username}</div>
+                <div>
+                    <Username user={user} />
+                </div>
                 {
                     <div className={styles.subText}>
                         {channel?.last_message && alert ? (
diff --git a/src/components/navigation/right/MemberSidebar.tsx b/src/components/navigation/right/MemberSidebar.tsx
index 0044b4e3c181be8a6ada2390f7c05b3b5e09419b..3ae16afd5bdd994fb80d9b17a2bbca35949bc84a 100644
--- a/src/components/navigation/right/MemberSidebar.tsx
+++ b/src/components/navigation/right/MemberSidebar.tsx
@@ -186,7 +186,7 @@ export function ServerMemberSidebar({
 
     useEffect(() => {
         if (status === ClientStatus.ONLINE && typeof members === "undefined") {
-            client.servers.members
+            client.members
                 .fetchMembers(channel.server)
                 .then((members) => setMembers(members));
         }
diff --git a/src/context/intermediate/modals/Prompt.tsx b/src/context/intermediate/modals/Prompt.tsx
index 99052cd81fc191c6b999a1d3a3e3c42960a4f43a..4b919a9e984a972b3c9cbeaa3cd1ba2c86da66d4 100644
--- a/src/context/intermediate/modals/Prompt.tsx
+++ b/src/context/intermediate/modals/Prompt.tsx
@@ -304,7 +304,7 @@ export function SpecialPromptModal(props: SpecialProps) {
                                 setProcessing(true);
 
                                 try {
-                                    await client.servers.members.kickMember(
+                                    await client.members.kickMember(
                                         props.target._id,
                                         props.user,
                                     );
diff --git a/src/context/revoltjs/events.ts b/src/context/revoltjs/events.ts
index 30f80f959d4a8d824bbb945a8ad8303d7a7da8fc..67f6267e9bd10853924996c958a587c442ab4d8f 100644
--- a/src/context/revoltjs/events.ts
+++ b/src/context/revoltjs/events.ts
@@ -112,7 +112,7 @@ export function registerEvents(
         client.users.addListener("mutation", logMutation);
         client.servers.addListener("mutation", logMutation);
         client.channels.addListener("mutation", logMutation);
-        client.servers.members.addListener("mutation", logMutation);
+        client.members.addListener("mutation", logMutation);
     }
 
     const online = () => {
@@ -146,7 +146,7 @@ export function registerEvents(
             client.users.removeListener("mutation", logMutation);
             client.servers.removeListener("mutation", logMutation);
             client.channels.removeListener("mutation", logMutation);
-            client.servers.members.removeListener("mutation", logMutation);
+            client.members.removeListener("mutation", logMutation);
         }
 
         window.removeEventListener("online", online);
diff --git a/src/context/revoltjs/hooks.ts b/src/context/revoltjs/hooks.ts
index 9fe16f5275beafeb1a4ea0f7e1807883477d7ced..7a4ba41ca2770644c2be494289031607926f2c36 100644
--- a/src/context/revoltjs/hooks.ts
+++ b/src/context/revoltjs/hooks.ts
@@ -122,6 +122,13 @@ export function useServers(ids?: string[], context?: HookContext) {
     )[];
 }
 
+export function useMember(id?: string, context?: HookContext) {
+    if (typeof id === "undefined") return;
+    return useObject("members", id, context) as
+        | Readonly<Servers.Member>
+        | undefined;
+}
+
 export function useDMs(context?: HookContext) {
     const ctx = useForceUpdate(context);
 
@@ -192,7 +199,7 @@ export function useChannelPermission(id: string, context?: HookContext) {
 
         if (server) {
             ctx.client.servers.addListener("update", mutationServer);
-            ctx.client.servers.members.addListener("update", mutationMember);
+            ctx.client.members.addListener("update", mutationMember);
         }
 
         return () => {
@@ -200,10 +207,7 @@ export function useChannelPermission(id: string, context?: HookContext) {
 
             if (server) {
                 ctx.client.servers.removeListener("update", mutationServer);
-                ctx.client.servers.members.removeListener(
-                    "update",
-                    mutationMember,
-                );
+                ctx.client.members.removeListener("update", mutationMember);
             }
         };
     }, [id]);
@@ -221,11 +225,11 @@ export function useServerPermission(id: string, context?: HookContext) {
 
     useEffect(() => {
         ctx.client.servers.addListener("update", mutation);
-        ctx.client.servers.members.addListener("update", mutationMember);
+        ctx.client.members.addListener("update", mutationMember);
 
         return () => {
             ctx.client.servers.removeListener("update", mutation);
-            ctx.client.servers.members.removeListener("update", mutationMember);
+            ctx.client.members.removeListener("update", mutationMember);
         };
     }, [id]);
 
diff --git a/src/pages/settings/server/Members.tsx b/src/pages/settings/server/Members.tsx
index 4f83a683652298eeef5fff6033169b463a1e3308..edd618f918fb1bc487486db23e08982b9fee7671 100644
--- a/src/pages/settings/server/Members.tsx
+++ b/src/pages/settings/server/Members.tsx
@@ -28,7 +28,7 @@ export function Members({ server }: Props) {
     const users = useUsers(members?.map((x) => x._id.user) ?? [], ctx);
 
     useEffect(() => {
-        ctx.client.servers.members
+        ctx.client.members
             .fetchMembers(server._id)
             .then((members) => setMembers(members));
     }, []);
@@ -126,7 +126,7 @@ export function Members({ server }: Props) {
                                             roles,
                                         )}
                                         onClick={async () => {
-                                            await ctx.client.servers.members.editMember(
+                                            await ctx.client.members.editMember(
                                                 server._id,
                                                 member._id.user,
                                                 {
diff --git a/yarn.lock b/yarn.lock
index a996624760bf99e22cd542cb2f59b0d5492a9634..e14cb3b2d7f01db3231b4cc7a5a89027589648aa 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3563,10 +3563,10 @@ reusify@^1.0.4:
   resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
   integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==
 
-revolt.js@^4.3.3-alpha.18:
-  version "4.3.3-alpha.18"
-  resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-4.3.3-alpha.18.tgz#a46cef600099ea22d2f6dc8d09def7e9135839af"
-  integrity sha512-3QTgX1407bLZEkxkhUsetalUGxcogpFLiTm+mPE3T9bAKgHlTC7y6F5JgHGtmMGWxsjKCDLHgHoAllwGwXJaig==
+revolt.js@^4.3.3-alpha.19:
+  version "4.3.3-alpha.19"
+  resolved "https://registry.yarnpkg.com/revolt.js/-/revolt.js-4.3.3-alpha.19.tgz#02b0fe8c44b6b803f5314a2d40eda5d3481901d3"
+  integrity sha512-cpJGqAnAzCV33zuFqiOlRopqhSMhSUZISB7vdsgvjS6Aof1UrWpJJO+POnVxo20FvLM0tMFZaHIxdYeW798U9w==
   dependencies:
     "@insertish/mutable" "1.1.0"
     axios "^0.19.2"