title: how can i change backgroundColor Around the button in header react-native
body: <p>how can i change background Color Around  the button in header?<br></p>
  <p>Please see the photo first
  <a href="https://i.stack.imgur.com/FfHuB.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/FfHuB.jpg" alt="icon with blue background" /></a></p>
  <pre class="lang-js prettyprint-override"><code>import Icon from 'react-native-vector-icons/FontAwesome5';
  const HomeStack = createStackNavigator();
  
  const HomeScreen = ({ navigation }) =&gt; (
    &lt;HomeStack.Navigator&gt;
      &lt;HomeStack.Screen
        name=&quot;Home&quot;
        component={Home}
        options={{
          headerStyle: {
            backgroundColor: '#f4511e',
          },
          safeAreaInsets: { left: 20 },
          headerStyle: { backgroundColor: 'red' },
          headerShown: true,
          title: '',
          headerBackTitleVisible: true,
          // headerTransparent: true,
          headerLeft: () =&gt; (
            &lt;Icon.Button
              name=&quot;bars&quot;
              size={25}
              color=&quot;red&quot;
              style={{
                backgroundColor: 'yellow',
                width: 45,
                borderRadius: 50,
                paddingRight: 0,
                alignItems: 'center',
                justifyContent: 'center',
                marginLeft: 30,
              }}
              onPress={() =&gt; navigation.openDrawer()}
            /&gt;
          ),
        }}
      /&gt;
    &lt;/HomeStack.Navigator&gt;
  );
  </code></pre>