diff --git a/src/components/dialogs/UserDialog/UserSummaryHeader.vue b/src/components/dialogs/UserDialog/UserSummaryHeader.vue
index f4a1a5de..1c0a29a8 100644
--- a/src/components/dialogs/UserDialog/UserSummaryHeader.vue
+++ b/src/components/dialogs/UserDialog/UserSummaryHeader.vue
@@ -74,29 +74,22 @@
                             @click="copyUserDisplayName(currentUser.username)"></span>
                     </template>
                 </div>
-                <div style="margin-top: 5px" v-show="!userDialog.loading">
+                <div class="mt-2 flex items-center gap-1" v-show="!userDialog.loading">
                     <TooltipWrapper side="top" :content="t('dialog.user.tags.trust_level')">
-                        <Badge
-                            variant="outline"
-                            class="name"
-                            :class="userDialog.ref.$trustClass"
-                            style="margin-right: 5px; margin-top: 5px">
-                            <Shield class="mr-1 h-4 w-4 inline-block" /> {{ userDialog.ref.$trustLevel }}
+                        <Badge variant="outline" class="name" :class="userDialog.ref.$trustClass">
+                            <Shield class="h-4 w-4" /> {{ userDialog.ref.$trustLevel }}
                         </Badge>
                     </TooltipWrapper>
                     <TooltipWrapper
                         v-if="userDialog.ref.ageVerified && userDialog.ref.ageVerificationStatus"
                         side="top"
                         :content="t('dialog.user.tags.age_verified')">
-                        <Badge
-                            variant="outline"
-                            class="x-tag-age-verification"
-                            style="margin-right: 5px; margin-top: 5px">
+                        <Badge variant="outline" class="x-tag-age-verification">
                             <template v-if="userDialog.ref.ageVerificationStatus === '18+'">
-                                <IdCard class="mr-1 h-4 w-4 inline-block" /> 18+
+                                <IdCard class="h-4 w-4" /> 18+
                             </template>
                             <template v-else>
-                                <IdCard class="mr-1 h-4 w-4 inline-block" />
+                                <IdCard class="h-4 w-4" />
                             </template>
                         </Badge>
                     </TooltipWrapper>
@@ -104,8 +97,8 @@
                         v-if="userDialog.isFriend && userDialog.friend"
                         side="top"
                         :content="t('dialog.user.tags.friend_number')">
-                        <Badge variant="outline" class="x-tag-friend" style="margin-right: 5px; margin-top: 5px">
-                            <UserPlus class="mr-1 h-4 w-4 inline-block" />
+                        <Badge variant="outline" class="x-tag-friend">
+                            <UserPlus class="h-4 w-4" />
                             {{ userDialog.ref.$friendNumber ? userDialog.ref.$friendNumber : '' }}
                         </Badge>
                     </TooltipWrapper>
@@ -113,11 +106,8 @@
                         v-if="userDialog.mutualFriendCount"
                         side="top"
                         :content="t('dialog.user.tags.mutual_friends')">
-                        <Badge
-                            variant="outline"
-                            class="x-tag-mutual-friend border-zinc-500/50! dark:border-zinc-400!"
-                            style="margin-right: 5px; margin-top: 5px">
-                            <Users class="mr-1 h-4 w-4 inline-block" />
+                        <Badge variant="outline" class="x-tag-mutual-friend border-zinc-500/50! dark:border-zinc-400!">
+                            <Users class="h-4 w-4" />
                             {{ userDialog.mutualFriendCount }}
                         </Badge>
                     </TooltipWrapper>
@@ -128,60 +118,35 @@
                         <Badge
                             variant="outline"
                             class="x-tag-discord cursor-pointer"
-                            style="margin-right: 5px; margin-top: 5px"
                             @click="openDiscordProfile(userDialog.ref.discordId)">
-                            <i class="ri-discord-line mr-1 h-4 w-4 inline-block" style="height: 1em; width: 1em"></i>
+                            <i class="ri-discord-line text-xs"></i>
                             {{ t('dialog.user.tags.discord') }}
                         </Badge>
                     </TooltipWrapper>
-                    <Badge
-                        v-if="userDialog.ref.$isTroll"
-                        variant="outline"
-                        class="x-tag-troll"
-                        style="margin-right: 5px; margin-top: 5px">
-                        Nuisance
-                    </Badge>
-                    <Badge
-                        v-if="userDialog.ref.$isProbableTroll"
-                        variant="outline"
-                        class="x-tag-troll"
-                        style="margin-right: 5px; margin-top: 5px">
+                    <Badge v-if="userDialog.ref.$isTroll" variant="outline" class="x-tag-troll"> Nuisance </Badge>
+                    <Badge v-if="userDialog.ref.$isProbableTroll" variant="outline" class="x-tag-troll">
                         Almost Nuisance
                     </Badge>
-                    <Badge
-                        v-if="userDialog.ref.$isModerator"
-                        variant="outline"
-                        class="x-tag-vip"
-                        style="margin-right: 5px; margin-top: 5px">
+                    <Badge v-if="userDialog.ref.$isModerator" variant="outline" class="x-tag-vip">
                         {{ t('dialog.user.tags.vrchat_team') }}
                     </Badge>
 
                     <TooltipWrapper v-if="userDialog.ref.$platform === 'standalonewindows'" side="top" content="PC">
-                        <Badge variant="outline" class="x-tag-platform-pc" style="margin-right: 5px; margin-top: 5px">
-                            <Monitor class="h-4 w-4 x-tag-platform-pc" />
+                        <Badge variant="outline" class="x-tag-platform-pc">
+                            <Monitor class="m-0.5 x-tag-platform-pc" />
                         </Badge>
                     </TooltipWrapper>
                     <TooltipWrapper v-else-if="userDialog.ref.$platform === 'android'" side="top" content="Android">
-                        <Badge
-                            variant="outline"
-                            class="x-tag-platform-quest"
-                            style="margin-right: 5px; margin-top: 5px">
-                            <Smartphone class="h-4 w-4 x-tag-platform-quest" />
+                        <Badge variant="outline" class="x-tag-platform-quest">
+                            <Smartphone class="m-0.5 x-tag-platform-quest" />
                         </Badge>
                     </TooltipWrapper>
                     <TooltipWrapper v-else-if="userDialog.ref.$platform === 'ios'" side="top" content="iOS">
-                        <Badge
-                            variant="outline"
-                            class="text-[#8e8e93] border-[#8e8e93]"
-                            style="margin-right: 5px; margin-top: 5px">
-                            <Apple class="h-4 w-4 text-[#8e8e93]" />
+                        <Badge variant="outline" class="text-[#8e8e93] border-[#8e8e93]">
+                            <Apple class="m-0.5 text-[#8e8e93]" />
                         </Badge>
                     </TooltipWrapper>
-                    <Badge
-                        v-else-if="userDialog.ref.$platform"
-                        variant="outline"
-                        class="x-tag-platform-other"
-                        style="margin-right: 5px; margin-top: 5px">
+                    <Badge v-else-if="userDialog.ref.$platform" variant="outline" class="x-tag-platform-other">
                         {{ userDialog.ref.$platform }}
                     </Badge>
 
@@ -193,10 +158,10 @@
                             color: userDialog.ref.$customTagColour,
                             'border-color': userDialog.ref.$customTagColour
                         }"
-                        style="margin-right: 5px; margin-top: 5px"
                         >{{ userDialog.ref.$customTag }}</Badge
                     >
-                    <br />
+                </div>
+                <div class="mt-1">
                     <TooltipWrapper v-for="badge in userDialog.ref.badges" :key="badge.badgeId" side="top">
                         <template #content>
                             <span>{{ badge.badgeName }}</span>
@@ -261,7 +226,7 @@
                         </div>
                     </TooltipWrapper>
                 </div>
-                <div style="margin-top: 5px">
+                <div>
                     <span style="font-size: 12px" v-text="userDialog.ref.statusDescription"></span>
                 </div>
             </div>
diff --git a/src/views/Login/Login.vue b/src/views/Login/Login.vue
index 324bf6e5..446263e4 100644
--- a/src/views/Login/Login.vue
+++ b/src/views/Login/Login.vue
@@ -3,14 +3,30 @@
         <div style="position: absolute; top: 0; left: 0; margin: 5px">
             <TooltipWrapper v-if="!noUpdater" side="top" :content="t('view.login.updater')">
                 <Button class="rounded-full mr-2 text-xs" size="icon-sm" variant="ghost" @click="showVRCXUpdateDialog"
-                    ><CircleArrowDown
+                    ><ArrowBigDownDash
                 /></Button>
             </TooltipWrapper>
             <TooltipWrapper side="top" :content="t('view.login.proxy_settings')">
-                <Button class="rounded-full text-xs" size="icon-sm" variant="ghost" @click="promptProxySettings"
-                    ><Route
+                <Button class="rounded-full mr-2 text-xs" size="icon-sm" variant="ghost" @click="promptProxySettings"
+                    ><Earth
                 /></Button>
             </TooltipWrapper>
+            <DropdownMenu>
+                <DropdownMenuTrigger as-child>
+                    <Button class="rounded-full text-xs" size="icon-sm" variant="ghost">
+                        <Languages />
+                    </Button>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent class="max-h-80 overflow-y-auto text-xs">
+                    <DropdownMenuCheckboxItem
+                        v-for="language in languageCodes"
+                        :key="language"
+                        :model-value="appLanguage === language"
+                        @select="changeAppLanguage(language)">
+                        {{ getLanguageName(language) }}
+                    </DropdownMenuCheckboxItem>
+                </DropdownMenuContent>
+            </DropdownMenu>
         </div>
         <div class="x-login">
             <div class="x-login-form-container">
@@ -60,11 +76,11 @@
                                 </Field>
                             </VeeField>
                         </FieldGroup>
-                        <label class="inline-flex items-center gap-2 mr-2">
+                        <label class="inline-flex items-center gap-2 mr-2 text-sm">
                             <Checkbox v-model="loginForm.saveCredentials" />
                             <span>{{ t('view.login.field.saveCredentials') }}</span>
                         </label>
-                        <label class="inline-flex items-center gap-2" style="margin-top: 10px">
+                        <label class="inline-flex items-center gap-2 text-sm" style="margin-top: 10px">
                             <Checkbox v-model="enableCustomEndpoint" @update:modelValue="handleCustomEndpointToggle" />
                             <span>{{ t('view.login.field.devEndpoint') }}</span>
                         </label>
@@ -145,12 +161,11 @@
                                     <span class="block truncate text-xs" v-text="user.loginParams.endpoint"></span>
                                 </div>
                                 <Button
-                                    class="rounded-full"
                                     size="icon-sm"
                                     variant="ghost"
-                                    style="margin-left: 10px"
+                                    class="cursor-pointer ml-2"
                                     @click.stop="clickDeleteSavedLogin(user.user.id)"
-                                    ><Trash2 class="h-3 w-3"
+                                    ><Minus class="text-sm"
                                 /></Button>
                             </div>
                         </div>
@@ -186,8 +201,14 @@
 
 <script setup>
     import { Field, FieldContent, FieldError, FieldGroup, FieldLabel } from '@/components/ui/field';
+    import { ArrowBigDownDash, Earth, Languages, Minus } from 'lucide-vue-next';
+    import {
+        DropdownMenu,
+        DropdownMenuCheckboxItem,
+        DropdownMenuContent,
+        DropdownMenuTrigger
+    } from '@/components/ui/dropdown-menu';
     import { onBeforeMount, onBeforeUnmount, ref, watch } from 'vue';
-    import { CircleArrowDown, Route, Trash2 } from 'lucide-vue-next';
     import { Field as VeeField, useForm } from 'vee-validate';
     import { useRoute, useRouter } from 'vue-router';
     import { Button } from '@/components/ui/button';
@@ -198,7 +219,13 @@
     import { useI18n } from 'vue-i18n';
     import { z } from 'zod';
 
-    import { useAuthStore, useGeneralSettingsStore, useVRCXUpdaterStore } from '../../stores';
+    import {
+        useAppearanceSettingsStore,
+        useAuthStore,
+        useGeneralSettingsStore,
+        useVRCXUpdaterStore
+    } from '../../stores';
+    import { getLanguageName, languageCodes } from '../../localization';
     import { openExternalLink, userImage } from '../../shared/utils';
     import { AppDebug } from '../../service/appConfig';
     import { watchState } from '../../service/watchState';
@@ -211,6 +238,10 @@
     const { promptProxySettings } = useGeneralSettingsStore();
     const { noUpdater } = storeToRefs(useVRCXUpdaterStore());
 
+    const appearanceSettingsStore = useAppearanceSettingsStore();
+    const { appLanguage } = storeToRefs(appearanceSettingsStore);
+    const { changeAppLanguage } = appearanceSettingsStore;
+
     const { t } = useI18n();
 
     const savedCredentials = ref({});