diff --git a/src/components/structures/UserMenu.tsx b/src/components/structures/UserMenu.tsx
index f3026ec12f..916d4c0d83 100644
--- a/src/components/structures/UserMenu.tsx
+++ b/src/components/structures/UserMenu.tsx
@@ -98,7 +98,7 @@ export default class UserMenu extends React.Component<IProps, IState> {
         if (theme.startsWith("custom-")) {
             return getCustomTheme(theme.substring("custom-".length)).is_dark;
         }
-        return theme === "dark";
+        return theme === "dark" || theme === "element-dark";
     }
 
     private onProfileUpdate = async () => {
@@ -152,7 +152,7 @@ export default class UserMenu extends React.Component<IProps, IState> {
         // Disable system theme matching if the user hits this button
         SettingsStore.setValue("use_system_theme", null, SettingLevel.DEVICE, false);
 
-        const newTheme = this.state.isDarkTheme ? "light" : "dark";
+        const newTheme = this.state.isDarkTheme ? "element" : "element-dark";
         SettingsStore.setValue("theme", null, SettingLevel.DEVICE, newTheme); // set at same level as Appearance tab
     };