diff --git a/src/styles/styles.ts b/src/styles/styles.ts
index 2d1a8b99a345..76674b26c65c 100644
--- a/src/styles/styles.ts
+++ b/src/styles/styles.ts
@@ -1339,7 +1339,7 @@ const styles = (theme: ThemeColors) =>
 
             // The bottom of the floating action button should align with the bottom of the compose box.
             // The value should be equal to the height + marginBottom + marginTop of chatItemComposeSecondaryRow
-            bottom: 25,
+            bottom: variables.fabBottom,
         },
 
         floatingActionButton: {
@@ -1398,7 +1398,9 @@ const styles = (theme: ThemeColors) =>
         createMenuPositionSidebar: (windowHeight: number) =>
             ({
                 horizontal: 18,
-                vertical: windowHeight - 75,
+                // Menu should be displayed 12px above the floating action button.
+                // To achieve that sidebar must be moved by: distance from the bottom of the sidebar to the fab (variables.fabBottom) + fab height (variables.componentSizeLarge) + distance above the fab (12px)
+                vertical: windowHeight - (variables.fabBottom + variables.componentSizeLarge + 12),
             } satisfies AnchorPosition),
 
         createMenuPositionProfile: (windowWidth: number) =>
diff --git a/src/styles/variables.ts b/src/styles/variables.ts
index 18800f5748d9..65d7f6a0311d 100644
--- a/src/styles/variables.ts
+++ b/src/styles/variables.ts
@@ -43,6 +43,7 @@ export default {
     avatarSizeMentionIcon: 16,
     avatarSizeSmallSubscript: 14,
     defaultAvatarPreviewSize: 360,
+    fabBottom: 25,
     fontSizeOnlyEmojis: 30,
     fontSizeOnlyEmojisHeight: 35,
     fontSizeSmall: getValueUsingPixelRatio(11, 17),