diff --git a/TestsExample/App.js b/TestsExample/App.js
index b3f627b9f..3dcde9010 100644
--- a/TestsExample/App.js
+++ b/TestsExample/App.js
@@ -8,6 +8,7 @@ import Test263 from './src/Test263';
 import Test349 from './src/Test349';
 import Test364 from './src/Test364';
 import Test528 from './src/Test528';
+import Test550 from './src/Test550';
 import Test556 from './src/Test556';
 import Test564 from './src/Test564';
 import Test577 from './src/Test577';
@@ -23,6 +24,7 @@ import Test691 from './src/Test691';
 import Test702 from './src/Test702';
 import Test706 from './src/Test706';
 import Test713 from './src/Test713';
+import Test748 from './src/Test748';
 import Test750 from './src/Test750';
 
 enableScreens();
diff --git a/TestsExample/assets/backButton.png b/TestsExample/assets/backButton.png
new file mode 100644
index 000000000..d05671e98
Binary files /dev/null and b/TestsExample/assets/backButton.png differ
diff --git a/TestsExample/src/Test550.js b/TestsExample/src/Test550.js
new file mode 100644
index 000000000..a260d175f
--- /dev/null
+++ b/TestsExample/src/Test550.js
@@ -0,0 +1,48 @@
+import React from 'react';
+import {Button, ScrollView} from 'react-native';
+import {NavigationContainer} from '@react-navigation/native';
+import {createNativeStackNavigator} from 'react-native-screens/native-stack';
+
+function HomeScreen({navigation}) {
+  return (
+    <ScrollView contentContainerStyle={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
+        <Button
+          onPress={() => navigation.navigate('Details')}
+          title="Go to Details"
+        />
+    </ScrollView>
+  );
+}
+
+function DetailsScreen() {
+  return (
+    <ScrollView />
+  );
+}
+
+const RootStack = createNativeStackNavigator();
+
+function RootStackScreen() {
+  return (
+    <RootStack.Navigator
+      screenOptions={{
+        backButtonImage: require('../assets/backButton.png'),
+        headerBackTitleVisible: false,
+        headerTintColor: 'red',
+      }}>
+      <RootStack.Screen name="Home" component={HomeScreen} options={{headerShown: false}}/>
+      <RootStack.Screen
+        name="Details"
+        component={DetailsScreen}
+      />
+    </RootStack.Navigator>
+  );
+}
+
+export default function App() {
+  return (
+    <NavigationContainer>
+      <RootStackScreen />
+    </NavigationContainer>
+  );
+}
diff --git a/TestsExample/src/Test748.tsx b/TestsExample/src/Test748.tsx
new file mode 100644
index 000000000..b4887c471
--- /dev/null
+++ b/TestsExample/src/Test748.tsx
@@ -0,0 +1,53 @@
+import React from 'react';
+import {Button, ScrollView, View} from 'react-native';
+import {NavigationContainer, NavigationProp, ParamListBase} from '@react-navigation/native';
+import {createNativeStackNavigator} from 'react-native-screens/native-stack';
+
+function HomeScreen({navigation}: {navigation: NavigationProp<ParamListBase>}) {
+  return (
+    <Button
+      onPress={() => {
+        navigation.navigate('Details');
+      }}
+      title="Go to details"
+    />
+  );
+}
+
+function DetailsScreen({navigation}: {navigation: NavigationProp<ParamListBase>}) {
+
+  const [visible, setVisible] = React.useState(true);
+
+  return (
+    <ScrollView>
+      <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
+        <Button
+          onPress={() => {
+            navigation.setOptions({headerRight: visible ? () => <View style={{width: 40, height: 40, backgroundColor: 'red'}} /> : () => null})
+            setVisible(!visible);
+          }}
+          title="Swap headerRight"
+        />
+      </View>
+    </ScrollView>
+  );
+}
+
+const RootStack = createNativeStackNavigator();
+
+function RootStackScreen() {
+  return (
+    <RootStack.Navigator>
+      <RootStack.Screen name="Home" component={HomeScreen}/>
+      <RootStack.Screen name="Details" component={DetailsScreen} />
+    </RootStack.Navigator>
+  );
+}
+
+export default function App(): JSX.Element {
+  return (
+    <NavigationContainer>
+      <RootStackScreen />
+    </NavigationContainer>
+  );
+}
diff --git a/ios/RNSScreenStackHeaderConfig.m b/ios/RNSScreenStackHeaderConfig.m
index 36bd4f87b..670fc8705 100644
--- a/ios/RNSScreenStackHeaderConfig.m
+++ b/ios/RNSScreenStackHeaderConfig.m
@@ -123,7 +123,14 @@ + (void)setAnimatedConfig:(UIViewController *)vc withConfig:(RNSScreenStackHeade
   // This action fails when navigating to the screen with header for the second time and loads default back button.
   // It looks like changing the tint color of navbar triggers an update of the items belonging to it and it seems to load the custom back image
   // so we change the tint color's alpha by a very small amount and then set it to the one it should have.
-  [navbar setTintColor:[config.color colorWithAlphaComponent:CGColorGetAlpha(config.color.CGColor) - 0.01]];
+#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_14_0) && \
+    __IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_14_0
+  // it brakes the behavior of `headerRight` in iOS 14, where the bug desribed above seems to be fixed, so we do nothing in iOS 14
+  if (@available(iOS 14.0, *)) {} else
+#endif
+  {
+    [navbar setTintColor:[config.color colorWithAlphaComponent:CGColorGetAlpha(config.color.CGColor) - 0.01]];
+  }
   [navbar setTintColor:config.color];
 
 #if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \