diff --git a/app/components/MentionList/MentionRow.tsx b/app/components/MentionList/MentionRow.tsx
index 742be56..922dbf7 100644
--- a/app/components/MentionList/MentionRow.tsx
+++ b/app/components/MentionList/MentionRow.tsx
@@ -22,6 +22,7 @@ export function MentionRow(props : MentionRowProps) {
                 name={props.title}
                 variant="light" 
                 color="initials"
+                bg={avatars.length > 0 ? '#fff' : undefined}
                 src={avatars.length > 0 ? avatars[0].avatar : null}
             ></Avatar>}
             <Flex direction={'column'}>
diff --git a/app/components/UserRow/UserRow.tsx b/app/components/UserRow/UserRow.tsx
index dec80b8..585679b 100644
--- a/app/components/UserRow/UserRow.tsx
+++ b/app/components/UserRow/UserRow.tsx
@@ -40,6 +40,7 @@ export function UserRow(props: UserRowProps) {
                     radius="xl"
                     name={userInfo.title}
                     color={'initials'}
+                    bg={avatars.length > 0 ? '#fff' : undefined}
                     src={avatars.length > 0 ? avatars[0].avatar : undefined}
                 />
                 <Flex direction={'column'}>