diff --git a/demo/src/screens/__tests__/__snapshots__/AvatarScreen.spec.js.snap b/demo/src/screens/__tests__/__snapshots__/AvatarScreen.spec.js.snap
index 3ca334b2fc..6285de6837 100644
--- a/demo/src/screens/__tests__/__snapshots__/AvatarScreen.spec.js.snap
+++ b/demo/src/screens/__tests__/__snapshots__/AvatarScreen.spec.js.snap
@@ -121,6 +121,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -247,6 +248,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -434,6 +436,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -448,6 +451,7 @@ exports[`AvatarScreen renders screen 1`] = `
           testID="undefined.container"
         >
           <Text
+            ellipsizeMode="clip"
             numberOfLines={1}
             style={
               [
@@ -663,6 +667,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -677,6 +682,7 @@ exports[`AvatarScreen renders screen 1`] = `
           testID="undefined.container"
         >
           <Text
+            ellipsizeMode="clip"
             numberOfLines={1}
             style={
               [
@@ -898,6 +904,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -1155,6 +1162,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -1412,6 +1420,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -1620,6 +1629,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -1877,6 +1887,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -2179,6 +2190,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -2367,6 +2379,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -2386,6 +2399,7 @@ exports[`AvatarScreen renders screen 1`] = `
           testID="undefined.container"
         >
           <Text
+            ellipsizeMode="clip"
             numberOfLines={1}
             style={
               [
@@ -2597,6 +2611,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -2616,6 +2631,7 @@ exports[`AvatarScreen renders screen 1`] = `
           testID="undefined.container"
         >
           <Text
+            ellipsizeMode="clip"
             numberOfLines={1}
             style={
               [
@@ -2827,6 +2843,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -3015,6 +3032,7 @@ exports[`AvatarScreen renders screen 1`] = `
                   "bottom": 0,
                   "justifyContent": "center",
                   "left": 0,
+                  "overflow": "hidden",
                   "position": "absolute",
                   "right": 0,
                   "top": 0,
@@ -3029,6 +3047,7 @@ exports[`AvatarScreen renders screen 1`] = `
           testID="undefined.container"
         >
           <Text
+            ellipsizeMode="clip"
             numberOfLines={1}
             style={
               [
diff --git a/src/components/avatar/index.tsx b/src/components/avatar/index.tsx
index d9b930df6a..bef6653cc9 100644
--- a/src/components/avatar/index.tsx
+++ b/src/components/avatar/index.tsx
@@ -8,6 +8,7 @@ import {
   ImagePropsBase,
   ImageStyle,
   TextStyle,
+  TextProps,
   AccessibilityProps
 } from 'react-native';
 import {Colors, BorderRadiuses} from '../../style';
@@ -120,6 +121,10 @@ export type AvatarProps = Pick<AccessibilityProps, 'accessibilityLabel'> &
      * The label color
      */
     labelColor?: string;
+    /*
+     * The ellipsize mode for the label, default is clip
+     */
+    labelEllipsizeMode?: TextProps['ellipsizeMode'];
     /**
      * ribbon label to display on the avatar
      */
@@ -185,6 +190,7 @@ const Avatar = forwardRef<any, AvatarProps>((props: AvatarProps, ref: React.Forw
     useAutoColors,
     autoColorsConfig,
     containerStyle,
+    labelEllipsizeMode = 'clip',
     onPress,
     children
   } = themeProps;
@@ -354,7 +360,7 @@ const Avatar = forwardRef<any, AvatarProps>((props: AvatarProps, ref: React.Forw
     >
       <View testID={`${testID}.container`} style={textContainerStyle}>
         {!_.isUndefined(text) && (
-          <Text numberOfLines={1} style={textStyle} testID={`${testID}.label`}>
+          <Text numberOfLines={1} ellipsizeMode={labelEllipsizeMode} style={textStyle} testID={`${testID}.label`}>
             {text}
           </Text>
         )}
@@ -373,7 +379,8 @@ const styles = StyleSheet.create({
     ...StyleSheet.absoluteFillObject,
     alignItems: 'center',
     justifyContent: 'center',
-    borderRadius: BorderRadiuses.br100
+    borderRadius: BorderRadiuses.br100,
+    overflow: 'hidden'
   },
   initialsContainerWithInset: {
     top: 1,