diff --git a/Libraries/Image/Image.ios.js b/Libraries/Image/Image.ios.js
index f4c5ca3ca421a5..98631a33555bc5 100644
--- a/Libraries/Image/Image.ios.js
+++ b/Libraries/Image/Image.ios.js
@@ -129,7 +129,7 @@ const BaseImage = (props: ImagePropsType, forwardedRef) => {
   // $FlowFixMe[prop-missing]
   const resizeMode = props.resizeMode || style.resizeMode || 'cover';
   // $FlowFixMe[prop-missing]
-  const tintColor = style.tintColor;
+  const tintColor = props.tintColor || style.tintColor;
 
   if (props.src != null) {
     console.warn(
diff --git a/Libraries/Image/ImageProps.js b/Libraries/Image/ImageProps.js
index 6bb36fedb5d4aa..d640bd7f543892 100644
--- a/Libraries/Image/ImageProps.js
+++ b/Libraries/Image/ImageProps.js
@@ -13,7 +13,11 @@
 import type {SyntheticEvent, LayoutEvent} from '../Types/CoreEventTypes';
 import type {EdgeInsetsProp} from '../StyleSheet/EdgeInsetsPropType';
 import type {ImageSource} from './ImageSource';
-import type {ViewStyleProp, ImageStyleProp} from '../StyleSheet/StyleSheet';
+import type {
+  ColorValue,
+  ViewStyleProp,
+  ImageStyleProp,
+} from '../StyleSheet/StyleSheet';
 import type {ViewProps} from '../Components/View/ViewPropTypes';
 import type {Node, Ref} from 'react';
 import typeof Image from './Image';
@@ -170,6 +174,13 @@ export type ImageProps = {|
    */
   testID?: ?string,
 
+  /**
+   * Changes the color of all the non-transparent pixels to the tintColor.
+   *
+   * See https://reactnative.dev/docs/image#tintcolor
+   */
+  tintColor?: ColorValue,
+
   src?: empty,
   children?: empty,
 |};
diff --git a/packages/rn-tester/js/examples/Image/ImageExample.js b/packages/rn-tester/js/examples/Image/ImageExample.js
index 729673c65b778d..5c257c81f44787 100644
--- a/packages/rn-tester/js/examples/Image/ImageExample.js
+++ b/packages/rn-tester/js/examples/Image/ImageExample.js
@@ -937,27 +937,77 @@ exports.examples = [
   },
   {
     title: 'Tint Color',
-    description: ('The `tintColor` style prop changes all the non-alpha ' +
+    description: ('The `tintColor` prop changes all the non-alpha ' +
       'pixels to the tint color.': string),
     render: function (): React.Node {
       return (
         <View>
+          <View style={styles.horizontal}>
+            <Image
+              source={require('../../assets/uie_thumb_normal.png')}
+              style={[styles.icon, {borderRadius: 5, tintColor: '#ff2d55'}]}
+              tintColor={'#5ac8fa'}
+            />
+            <Image
+              source={require('../../assets/uie_thumb_normal.png')}
+              style={[styles.icon, {borderRadius: 5}]}
+              tintColor={'#4cd964'}
+            />
+            <Image
+              source={require('../../assets/uie_thumb_normal.png')}
+              style={[styles.icon, {borderRadius: 5}]}
+              tintColor={'#ff2d55'}
+            />
+            <Image
+              source={require('../../assets/uie_thumb_normal.png')}
+              style={[styles.icon, {borderRadius: 5}]}
+              tintColor={'#8e8e93'}
+            />
+          </View>
+          <Text style={styles.sectionText}>
+            It also works using the `tintColor` style prop
+          </Text>
+          <View style={styles.horizontal}>
+            <Image
+              source={require('../../assets/uie_thumb_normal.png')}
+              style={[styles.icon, {borderRadius: 5, tintColor: '#5ac8fa'}]}
+            />
+            <Image
+              source={require('../../assets/uie_thumb_normal.png')}
+              style={[styles.icon, {borderRadius: 5, tintColor: '#4cd964'}]}
+            />
+            <Image
+              source={require('../../assets/uie_thumb_normal.png')}
+              style={[styles.icon, {borderRadius: 5, tintColor: '#ff2d55'}]}
+            />
+            <Image
+              source={require('../../assets/uie_thumb_normal.png')}
+              style={[styles.icon, {borderRadius: 5, tintColor: '#8e8e93'}]}
+            />
+          </View>
+          <Text style={styles.sectionText}>
+            The `tintColor` prop has precedence over the `tintColor` style prop
+          </Text>
           <View style={styles.horizontal}>
             <Image
               source={require('../../assets/uie_thumb_normal.png')}
               style={[styles.icon, {borderRadius: 5, tintColor: '#5ac8fa'}]}
+              tintColor={'#5ac8fa'}
             />
             <Image
               source={require('../../assets/uie_thumb_normal.png')}
               style={[styles.icon, {borderRadius: 5, tintColor: '#4cd964'}]}
+              tintColor={'#5ac8fa'}
             />
             <Image
               source={require('../../assets/uie_thumb_normal.png')}
               style={[styles.icon, {borderRadius: 5, tintColor: '#ff2d55'}]}
+              tintColor={'#5ac8fa'}
             />
             <Image
               source={require('../../assets/uie_thumb_normal.png')}
               style={[styles.icon, {borderRadius: 5, tintColor: '#8e8e93'}]}
+              tintColor={'#5ac8fa'}
             />
           </View>
           <Text style={styles.sectionText}>