diff --git a/packages/console/src/components/AppContent/components/UserInfo/index.tsx b/packages/console/src/components/AppContent/components/UserInfo/index.tsx
index ecc453e8e..b61c0d198 100644
--- a/packages/console/src/components/AppContent/components/UserInfo/index.tsx
+++ b/packages/console/src/components/AppContent/components/UserInfo/index.tsx
@@ -5,7 +5,7 @@ import { useTranslation } from 'react-i18next';
 
 import Dropdown, { DropdownItem } from '@/components/Dropdown';
 import { Ring as Spinner } from '@/components/Spinner';
-import { getAvatarById } from '@/consts/avatars';
+import { generateAvatarPlaceHolderById } from '@/consts/avatars';
 import useApi from '@/hooks/use-api';
 import SignOut from '@/icons/SignOut';
 
@@ -45,7 +45,7 @@ const UserInfo = () => {
           setShowDropdown(true);
         }}
       >
-        <img src={avatar || getAvatarById(id)} />
+        <img src={avatar || generateAvatarPlaceHolderById(id)} />
         <div className={styles.wrapper}>
           <div className={styles.name}>{name || t('users.unnamed')}</div>
         </div>
diff --git a/packages/console/src/consts/avatars.ts b/packages/console/src/consts/avatars.ts
index dea7190c7..ce6258de9 100644
--- a/packages/console/src/consts/avatars.ts
+++ b/packages/console/src/consts/avatars.ts
@@ -22,4 +22,5 @@ export const Avatars = [
   avatar010,
 ];
 
-export const getAvatarById = (id: string) => Avatars[(id.codePointAt(0) ?? 0) % Avatars.length];
+export const generateAvatarPlaceHolderById = (id: string) =>
+  Avatars[(id.codePointAt(0) ?? 0) % Avatars.length];
diff --git a/packages/console/src/pages/UserDetails/index.tsx b/packages/console/src/pages/UserDetails/index.tsx
index cf7ea197f..1e75708e0 100644
--- a/packages/console/src/pages/UserDetails/index.tsx
+++ b/packages/console/src/pages/UserDetails/index.tsx
@@ -20,7 +20,7 @@ import FormField from '@/components/FormField';
 import LinkButton from '@/components/LinkButton';
 import TabNav, { TabNavItem } from '@/components/TabNav';
 import TextInput from '@/components/TextInput';
-import { getAvatarById } from '@/consts/avatars';
+import { generateAvatarPlaceHolderById } from '@/consts/avatars';
 import useApi, { RequestError } from '@/hooks/use-api';
 import Back from '@/icons/Back';
 import Delete from '@/icons/Delete';
@@ -122,7 +122,10 @@ const UserDetails = () => {
       {userId && data && (
         <>
           <Card className={styles.header}>
-            <img className={styles.avatar} src={data.avatar || getAvatarById(userId)} />
+            <img
+              className={styles.avatar}
+              src={data.avatar || generateAvatarPlaceHolderById(userId)}
+            />
             <div className={styles.metadata}>
               <div className={styles.name}>{data.name ?? '-'}</div>
               <div>
diff --git a/packages/console/src/pages/Users/index.tsx b/packages/console/src/pages/Users/index.tsx
index 6cbed31a9..6eee23a4f 100644
--- a/packages/console/src/pages/Users/index.tsx
+++ b/packages/console/src/pages/Users/index.tsx
@@ -18,7 +18,7 @@ import Search from '@/components/Search';
 import TableEmpty from '@/components/Table/TableEmpty';
 import TableError from '@/components/Table/TableError';
 import TableLoading from '@/components/Table/TableLoading';
-import { getAvatarById } from '@/consts/avatars';
+import { generateAvatarPlaceHolderById } from '@/consts/avatars';
 import { RequestError } from '@/hooks/use-api';
 import Plus from '@/icons/Plus';
 import * as modalStyles from '@/scss/modal.module.scss';
@@ -127,7 +127,12 @@ const Users = () => {
                   <ItemPreview
                     title={name || t('users.unnamed')}
                     subtitle={conditionalString(username)}
-                    icon={<img className={styles.avatar} src={avatar || getAvatarById(id)} />}
+                    icon={
+                      <img
+                        className={styles.avatar}
+                        src={avatar || generateAvatarPlaceHolderById(id)}
+                      />
+                    }
                     to={`/users/${id}`}
                     size="compact"
                   />