title: Remove Header in React navigation v6
body: <p>Remove Header in React navigation 6 with custom style
  here is code foe stack navigation</p>
  <pre><code> &lt;NavigationContainer&gt;
    &lt;Stack.Navigator
      initialRouteName='OtpScreen'
      // screenOptions={{
      //   headerShown: false,
      // }}
      screenOptions={{ headerMode: 'none' }}
    &gt;
      &lt;Stack.Screen
        options={{ headerShown: false }}
        name='Tabs'
        component={MyTabs}
      /&gt;
  
    &lt;/Stack.Navigator&gt;
  &lt;/NavigationContainer&gt;
  </code></pre>
  <p>tab navigation</p>
  <pre><code>   &lt;Tab.Navigator
    useHeaderHeight={false}
    screenOptions={
      ({
        headerShown: false,
      },
      ({ route }) =&gt; ({
        tabBarIcon: ({ focused, color, size }) =&gt; {
          let iconName;
  
          if (route.name === 'Home') {
            iconName = focused
              ? 'ios-information-circle'
              : 'ios-information-circle-outline';
          } else if (route.name === 'Settings') {
            iconName = focused ? 'ios-list' : 'ios-list';
          }
  
          // You can return any component that you like here!
          return &lt;Ionicons name={iconName} size={size} color={color} /&gt;;
        },
        tabBarActiveTintColor: 'tomato',
        tabBarInactiveTintColor: 'gray',
      }))
    }
  &gt;
  </code></pre>
  <p>I use every possible solution still not get the answer I want to use it with custom style as I shown</p>