diff --git a/changelog.d/profilebg.add b/changelog.d/profilebg.add
new file mode 100644
index 000000000..a2c79074a
--- /dev/null
+++ b/changelog.d/profilebg.add
@@ -0,0 +1 @@
+displaying other user's backgrounds (if supported by BE)
diff --git a/src/App.js b/src/App.js
index 9fb4d32e5..a24ff4255 100644
--- a/src/App.js
+++ b/src/App.js
@@ -149,13 +149,23 @@ export default {
     userBackground() {
       return this.currentUser.background_image
     },
+    foreignProfileBackground() {
+      return (
+        useMergedConfigStore().mergedConfig.allowForeignUserBackground &&
+        useInterfaceStore().foreignProfileBackground
+      )
+    },
     instanceBackground() {
       return useMergedConfigStore().mergedConfig.hideInstanceWallpaper
         ? null
         : this.instanceBackgroundUrl
     },
     background() {
-      return this.userBackground || this.instanceBackground
+      return (
+        this.foreignProfileBackground ||
+        this.userBackground ||
+        this.instanceBackground
+      )
     },
     bgStyle() {
       if (this.background) {
diff --git a/src/App.scss b/src/App.scss
index 56fef9d11..952af5b47 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -200,6 +200,7 @@ nav {
   background-color: var(--wallpaper);
   background-image: var(--body-background-image);
   background-position: 50%;
+  transition: background-image 1s;
 }
 
 .underlay {
diff --git a/src/components/settings_modal/tabs/appearance_tab.vue b/src/components/settings_modal/tabs/appearance_tab.vue
index f0ccf71f3..1343a36d5 100644
--- a/src/components/settings_modal/tabs/appearance_tab.vue
+++ b/src/components/settings_modal/tabs/appearance_tab.vue
@@ -263,6 +263,11 @@
             {{ $t('settings.hide_wallpaper') }}
           </BooleanSetting>
         </li>
+        <li>
+          <BooleanSetting path="allowForeignUserBackground">
+            {{ $t('settings.foreign_user_background') }}
+          </BooleanSetting>
+        </li>
         <li>
           <BooleanSetting path="compactProfiles">
             {{ $t('settings.compact_profiles') }}
diff --git a/src/components/status_action_buttons/action_button_container.vue b/src/components/status_action_buttons/action_button_container.vue
index 348b158a7..da0beed79 100644
--- a/src/components/status_action_buttons/action_button_container.vue
+++ b/src/components/status_action_buttons/action_button_container.vue
@@ -79,7 +79,7 @@
       :button="button"
       :status="status"
       v-bind="$attrs"
-      @emojiPickerShown="e => $emit('emojiPickerShown', e)"
+      @emoji-picker-shown="e => $emit('emojiPickerShown', e)"
     />
     <teleport to="#modal">
       <MuteConfirm
diff --git a/src/components/status_action_buttons/status_action_buttons.vue b/src/components/status_action_buttons/status_action_buttons.vue
index 7017a8cf0..bdb95e83b 100644
--- a/src/components/status_action_buttons/status_action_buttons.vue
+++ b/src/components/status_action_buttons/status_action_buttons.vue
@@ -20,7 +20,7 @@
           :get-component="getComponent"
           :close="() => { /* no-op */ }"
           :do-action="doAction"
-          @emojiPickerShown="onEmojiPickerShown"
+          @emoji-picker-shown="onEmojiPickerShown"
         />
         <button
           v-if="showPin && currentUser"
diff --git a/src/components/user_profile/user_profile.js b/src/components/user_profile/user_profile.js
index 17d69f49b..bde19637d 100644
--- a/src/components/user_profile/user_profile.js
+++ b/src/components/user_profile/user_profile.js
@@ -12,6 +12,7 @@ import UserCard from '../user_card/user_card.vue'
 
 import { useInstanceStore } from 'src/stores/instance.js'
 import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
+import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
@@ -56,9 +57,14 @@ const UserProfile = {
     const routeParams = this.$route.params
     this.load({ name: routeParams.name, id: routeParams.id })
     this.tab = get(this.$route, 'query.tab', defaultTabKey)
+    useInterfaceStore().setForeignProfileBackground(this.user?.background_image)
+  },
+  updated() {
+    useInterfaceStore().setForeignProfileBackground(this.user?.background_image)
   },
   unmounted() {
     this.stopFetching()
+    useInterfaceStore().setForeignProfileBackground(null)
   },
   computed: {
     timeline() {
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 95f02507b..e03e21403 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -636,6 +636,7 @@
     "navbar_column_stretch": "Stretch navbar to columns width",
     "always_show_post_button": "Always show floating New Post button",
     "hide_wallpaper": "Hide instance wallpaper",
+    "foreign_user_background": "Allow other user's profiles to override wallpaper",
     "preload_images": "Preload images",
     "use_one_click_nsfw": "Open NSFW attachments with just one click",
     "hide_post_stats": "Hide post statistics (e.g. the number of favorites)",
diff --git a/src/modules/default_config_state.js b/src/modules/default_config_state.js
index 208dc548b..6a970ef0f 100644
--- a/src/modules/default_config_state.js
+++ b/src/modules/default_config_state.js
@@ -140,6 +140,10 @@ export const INSTANCE_DEFAULT_CONFIG_DEFINITIONS = {
     description: 'Hide Instance-specific panel',
     default: false,
   },
+  allowForeignUserBackground: {
+    description: "Allow other user's profiles to override wallpaper",
+    default: true,
+  },
   hideInstanceWallpaper: {
     description: 'Hide Instance default background',
     default: false,
diff --git a/src/stores/interface.js b/src/stores/interface.js
index 111700fbb..01ff07533 100644
--- a/src/stores/interface.js
+++ b/src/stores/interface.js
@@ -60,6 +60,7 @@ export const useInterfaceStore = defineStore('interface', {
     globalNotices: [],
     layoutHeight: 0,
     lastTimeline: null,
+    foreignProfileBackground: null,
   }),
   actions: {
     setTemporaryChanges({ confirm, revert }) {
@@ -96,6 +97,9 @@ export const useInterfaceStore = defineStore('interface', {
         console.error(`${error}`)
       }
     },
+    setForeignProfileBackground(url) {
+      this.foreignProfileBackground = url
+    },
     settingsSaved({ success, error }) {
       if (success) {
         if (this.noticeClearTimeout) {