diff --git a/front/src/modules/ui/navbar/components/NavWorkspaceButton.tsx b/front/src/modules/ui/navbar/components/NavWorkspaceButton.tsx
index 9156f3a763..36556278c8 100644
--- a/front/src/modules/ui/navbar/components/NavWorkspaceButton.tsx
+++ b/front/src/modules/ui/navbar/components/NavWorkspaceButton.tsx
@@ -32,6 +32,7 @@ type StyledLogoProps = {
 
 const StyledLogo = styled.div<StyledLogoProps>`
   background: url(${(props) => props.logo});
+  background-position: center;
   background-size: cover;
   border-radius: ${({ theme }) => theme.border.radius.xs};
   height: 16px;
diff --git a/front/src/modules/users/components/Avatar.tsx b/front/src/modules/users/components/Avatar.tsx
index 25718306c2..b8fc7c674d 100644
--- a/front/src/modules/users/components/Avatar.tsx
+++ b/front/src/modules/users/components/Avatar.tsx
@@ -23,6 +23,7 @@ export const StyledAvatar = styled.div<OwnProps & { colorId: string }>`
     !isNonEmptyString(avatarUrl) ? stringToHslColor(colorId, 75, 85) : 'none'};
   ${({ avatarUrl }) =>
     isNonEmptyString(avatarUrl) ? `background-image: url(${avatarUrl});` : ''}
+  background-position: center;
   background-size: cover;
   border-radius: ${(props) => (props.type === 'rounded' ? '50%' : '2px')};
   color: ${({ colorId }) => stringToHslColor(colorId, 75, 25)};