How to set the background color of Tab.Navigator in 2023?

Question

The below code is for bottom tab navigator how do I change color of it! I tried many things like changing the color of the background using style options tried screen options color but it was not working I even activetint color and other but it was only icons and all .If anyone can help me regarding this I would be grateful :)

<Tab.Navigator initialRouteName='CustomerStack'
        
         screenOptions={({ route, }) => ({    
            
            tabBarIcon: ({ focused, color, size }) => {
                let iconName;
                let rn = route.name;
                if (rn === "CustomDrawer") {
                    iconName = focused ? 'home' : 'home'
                }
                else if (rn === "CustomerStack") {
                    iconName = focused ? 'home' : 'home'
                } 
                else if (rn === "Cart") {
                    iconName = focused ? 'shopping-cart' : 'shopping-cart'
                } else if (rn === "Account") {
                    iconName = focused ? 'user' : 'user'
                }
                return <User name={iconName} size={size} color={color} />
            },
        })}>

This is what I tried

<Tab.Navigator
    tabBarOptions={{
      activeTintColor: '#e91e63',
      style: {
        backgroundColor: 'orange',
      },
    }}
  >
    <Tab.Screen name="Home" component={HomeScreen} />
    <Tab.Screen name="Profile" component={ProfileScreen} />
  </Tab.Navigator>

Answer 1

Try in this way:

<Tab.Navigator
        screenOptions={{
          tabBarStyle: {
            backgroundColor: 'orange',
          },
        }}>
        <Tab.Screen name="Home" component={HomeScreen} />
        <Tab.Screen name="Profile" component={ProfileScreen} />
      </Tab.Navigator>