diff --git a/packages/ui-components/Common/AvatarGroup/index.module.css b/packages/ui-components/Common/AvatarGroup/index.module.css
index 9477a8ea5829d..63596b3fe55a1 100644
--- a/packages/ui-components/Common/AvatarGroup/index.module.css
+++ b/packages/ui-components/Common/AvatarGroup/index.module.css
@@ -4,22 +4,18 @@
   @apply flex
     flex-wrap
     items-center;
-
-  &:not(.expandable) {
-    > span {
-      @apply ml-0;
-    }
-  }
 }
 
 .small {
   > span {
-    @apply -ml-2;
+    @apply -ml-2
+      first:ml-0;
   }
 }
 
 .medium {
   > span {
-    @apply -ml-2.5;
+    @apply -ml-2.5
+      first:ml-0;
   }
 }
diff --git a/packages/ui-components/Common/AvatarGroup/index.tsx b/packages/ui-components/Common/AvatarGroup/index.tsx
index 53bc368393bb7..413a8c4d99c60 100644
--- a/packages/ui-components/Common/AvatarGroup/index.tsx
+++ b/packages/ui-components/Common/AvatarGroup/index.tsx
@@ -42,11 +42,7 @@ const AvatarGroup: FC<AvatarGroupProps> = ({
     : undefined;
 
   return (
-    <div
-      className={classNames(styles.avatarGroup, styles[size], {
-        [styles.expandable]: avatars.length > limit,
-      })}
-    >
+    <div className={classNames(styles.avatarGroup, styles[size])}>
       {renderAvatars.map(avatar => (
         <Tooltip
           key={avatar.nickname}