diff --git a/src/features/tweaks.json b/src/features/tweaks.json
index 9278e2426..2b76359e0 100644
--- a/src/features/tweaks.json
+++ b/src/features/tweaks.json
@@ -22,6 +22,11 @@
       "label": "Use a slim layout for filtered posts",
       "default": false
     },
+    "badge_stack": {
+      "type": "checkbox",
+      "label": "Use a slim layout for user badges",
+      "default": false
+    },
     "highlight_contributed_content": {
       "type": "checkbox",
       "label": "Highlight contributed content on reblogs",
diff --git a/src/features/tweaks/badge_stack.js b/src/features/tweaks/badge_stack.js
new file mode 100644
index 000000000..e72c1b29e
--- /dev/null
+++ b/src/features/tweaks/badge_stack.js
@@ -0,0 +1,55 @@
+import { keyToCss } from '../../utils/css_map.js';
+import { buildStyle } from '../../utils/interface.js';
+
+const wrapper = keyToCss('leftContentMain', 'username');
+const badgeContainer = keyToCss('badgeContainer');
+const badgeImage = ':is(svg, img)';
+
+export const styleElement = buildStyle(`
+
+${wrapper}:not(:hover) ${badgeContainer} + ${badgeContainer} {
+  margin-left: -7px;
+}
+
+${wrapper}:not(:hover) ${badgeContainer} ${badgeImage} {
+  filter: drop-shadow(1px 0px 2px rgb(0 0 0 / 0.5));
+}
+
+${wrapper} {
+  margin-right: 7px;
+  isolation: isolate;
+}
+
+/* do not apply this on hover or the hover popups break */
+${wrapper}:not(:hover) ${badgeContainer} {
+  position: relative;
+  z-index: calc(0 - var(--badges-index));
+}
+`);
+
+const transitionStyleElement = buildStyle(`
+${badgeContainer} {
+  transition: margin 0.5s ease;
+}
+${wrapper}:hover ${badgeContainer} {
+  transition:
+    margin 0.5s ease,
+    position 0s 0.5s,
+    z-index 0s 0.5s;
+  transition-behavior: allow-discrete;
+}
+${badgeContainer} ${badgeImage} {
+  transition: filter 0.35s linear;
+}
+`);
+
+const waitForRender = () =>
+  new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve)));
+
+export const main = async () => {
+  waitForRender().then(() => document.documentElement.append(transitionStyleElement));
+};
+
+export const clean = async () => {
+  transitionStyleElement.remove();
+};