diff --git a/nym-wallet/src/components/Accounts/AccountAvatar.tsx b/nym-wallet/src/components/Accounts/AccountAvatar.tsx
new file mode 100644
index 0000000000..fb2ba5da4b
--- /dev/null
+++ b/nym-wallet/src/components/Accounts/AccountAvatar.tsx
@@ -0,0 +1,8 @@
+import React from 'react';
+import { Avatar } from '@mui/material';
+import stc from 'string-to-color';
+import { TAccount } from 'src/types';
+
+export const AccountAvatar = ({ name, address }: TAccount) => (
+  <Avatar sx={{ bgcolor: stc(address), width: 35, height: 35, fontSize: 20 }}>{name.split('')[0]}</Avatar>
+);