diff --git a/src/components/app/workspaces/CurrentWorkspace.tsx b/src/components/app/workspaces/CurrentWorkspace.tsx
index da49b683..bbb351f7 100644
--- a/src/components/app/workspaces/CurrentWorkspace.tsx
+++ b/src/components/app/workspaces/CurrentWorkspace.tsx
@@ -33,7 +33,9 @@ function CurrentWorkspace({
     <>
       <Avatar shape={'square'} size={'xs'}>
         <AvatarImage src={selectedWorkspace.icon} alt={''} />
-        <AvatarFallback>{selectedWorkspace.name}</AvatarFallback>
+        <AvatarFallback>
+          {selectedWorkspace.icon ? <span className='text-xl'>{selectedWorkspace.icon}</span> : selectedWorkspace.name}
+        </AvatarFallback>
       </Avatar>
 
       <div className={'flex-1 truncate font-medium text-text-primary'}>{selectedWorkspace.name}</div>
diff --git a/src/components/app/workspaces/WorkspaceItem.tsx b/src/components/app/workspaces/WorkspaceItem.tsx
index 510a93ae..ef0cd92a 100644
--- a/src/components/app/workspaces/WorkspaceItem.tsx
+++ b/src/components/app/workspaces/WorkspaceItem.tsx
@@ -4,7 +4,7 @@ import { useTranslation } from 'react-i18next';
 
 import { Workspace } from '@/application/types';
 import MoreActions from '@/components/app/workspaces/MoreActions';
-import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { Avatar, AvatarFallback } from '@/components/ui/avatar';
 import { DropdownMenuItem, DropdownMenuItemTick } from '@/components/ui/dropdown-menu';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
 
@@ -81,8 +81,9 @@ export function WorkspaceItem({
       onMouseLeave={() => setHovered(false)}
     >
       <Avatar shape={'square'} size={'xs'}>
-        <AvatarImage src={workspace.icon} alt={''} />
-        <AvatarFallback>{workspace.name}</AvatarFallback>
+        <AvatarFallback>
+          {workspace.icon ? <span className='text-xl'>{workspace.icon}</span> : workspace.name}
+        </AvatarFallback>
       </Avatar>
       <div className={'flex flex-1 flex-col items-start overflow-hidden'}>
         <Tooltip delayDuration={1000}>
diff --git a/src/components/ui/avatar.tsx b/src/components/ui/avatar.tsx
index d0d69976..55e6f781 100644
--- a/src/components/ui/avatar.tsx
+++ b/src/components/ui/avatar.tsx
@@ -89,10 +89,14 @@ function AvatarFallback({ className, children, ...props }: React.ComponentProps<
     <AvatarPrimitive.Fallback
       data-slot='avatar-fallback'
       className={cn('flex h-full w-full items-center justify-center text-icon-primary', className)}
-      style={{
-        backgroundColor,
-        color,
-      }}
+      style={
+        isString
+          ? {
+              backgroundColor,
+              color,
+            }
+          : undefined
+      }
       {...props}
     >
       {!isString ? children : char}