diff --git a/native/navigation/community-drawer-button-icon.react.js b/native/navigation/community-drawer-button-icon.react.js
--- a/native/navigation/community-drawer-button-icon.react.js
+++ b/native/navigation/community-drawer-button-icon.react.js
@@ -2,18 +2,27 @@
 
 import Icon from '@expo/vector-icons/Feather.js';
 import * as React from 'react';
+import { View } from 'react-native';
 
 import { useStyles } from '../themes/colors.js';
 
 // eslint-disable-next-line no-unused-vars
 export default function CommunityDrawerButtonIcon(props: { ... }): React.Node {
   const styles = useStyles(unboundStyles);
-  return <Icon name="menu" size={26} style={styles.drawerButton} />;
+  return (
+    <View style={styles.background}>
+      <Icon name="menu" size={26} style={styles.drawerButton} />
+    </View>
+  );
 }
 
 const unboundStyles = {
   drawerButton: {
     color: 'listForegroundSecondaryLabel',
-    marginLeft: 16,
+    padding: 6,
+  },
+  background: {
+    marginLeft: 10,
+    backgroundColor: 'tabBarBackground',
   },
 };