diff --git a/frontend/taipy-gui/src/components/Taipy/Status.spec.tsx b/frontend/taipy-gui/src/components/Taipy/Status.spec.tsx
index 38aaefe709..38e1c537b5 100644
--- a/frontend/taipy-gui/src/components/Taipy/Status.spec.tsx
+++ b/frontend/taipy-gui/src/components/Taipy/Status.spec.tsx
@@ -12,38 +12,58 @@
  */
 
 import React from "react";
-import {render} from "@testing-library/react";
+import { render } from "@testing-library/react";
 import "@testing-library/jest-dom";
 import userEvent from "@testing-library/user-event";
+import { getStatusIcon } from "./Status";
 
-import { PlusOneOutlined } from "@mui/icons-material";
+import Status, { StatusType } from "./Status";
 
-import Status, { StatusType } from './Status';
-
-const status: StatusType = {status: "status", message: "message"};
+const status: StatusType = { status: "status", message: "message" };
 
 describe("Status Component", () => {
     it("renders", async () => {
-        const {getByText} = render(<Status value={status} />);
+        const { getByText } = render(<Status value={status} />);
         const elt = getByText("message");
-        const av = getByText("S");
         expect(elt.tagName).toBe("SPAN");
-        expect(av.tagName).toBe("DIV");
-    })
+    });
     it("uses the class", async () => {
-        const {getByText} = render(<Status value={status} className="taipy-status" />);
+        const { getByText } = render(<Status value={status} className="taipy-status" />);
         const elt = getByText("message");
         expect(elt.parentElement).toHaveClass("taipy-status");
-    })
+    });
     it("can be closed", async () => {
         const myClose = jest.fn();
-        const {getByTestId} = render(<Status value={status} onClose={myClose} />);
+        const { getByTestId } = render(<Status value={status} onClose={myClose} />);
         const elt = getByTestId("CancelIcon");
         await userEvent.click(elt);
         expect(myClose).toHaveBeenCalled();
-    })
-    it("displays the icon", async () => {
-        const {getByTestId} = render(<Status value={status} icon={<PlusOneOutlined/>} onClose={jest.fn()} />);
-        getByTestId("PlusOneOutlinedIcon");
-    })
+    });
+});
+
+describe("StatusAvatar Icon Rendering", () => {
+    it("renders the correct icon for 'S' status", () => {
+        const { getByTestId } = render(getStatusIcon("S"));
+        getByTestId("CheckCircleIcon");
+    });
+
+    it("renders the correct icon for 'E' status", () => {
+        const { getByTestId } = render(getStatusIcon("E"));
+        getByTestId("ErrorIcon");
+    });
+
+    it("renders the correct icon for 'W' status", () => {
+        const { getByTestId } = render(getStatusIcon("W"));
+        getByTestId("WarningIcon");
+    });
+
+    it("renders the correct icon for 'I' status", () => {
+        const { getByTestId } = render(getStatusIcon("I"));
+        getByTestId("InfoIcon");
+    });
+
+    it("renders the default emoji for unknown status", () => {
+        const { getByText } = render(getStatusIcon("unknown"));
+        getByText("❓");
+    });
 });
diff --git a/frontend/taipy-gui/src/components/Taipy/Status.tsx b/frontend/taipy-gui/src/components/Taipy/Status.tsx
index d5dcf7e4ae..1c2ddb3477 100644
--- a/frontend/taipy-gui/src/components/Taipy/Status.tsx
+++ b/frontend/taipy-gui/src/components/Taipy/Status.tsx
@@ -14,6 +14,10 @@
 import React, { MouseEvent, ReactNode, useMemo } from "react";
 import Chip from "@mui/material/Chip";
 import Avatar from "@mui/material/Avatar";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import ErrorIcon from "@mui/icons-material/Error";
+import WarningIcon from "@mui/icons-material/Warning";
+import InfoIcon from "@mui/icons-material/Info";
 
 import { getInitials } from "../../utils";
 import { TaipyBaseProps } from "./utils";
@@ -30,6 +34,21 @@ interface StatusProps extends TaipyBaseProps {
     icon?: ReactNode;
 }
 
+export const getStatusIcon = (status: string) => {
+    switch (status) {
+        case "S":
+            return <CheckCircleIcon data-testid="CheckCircleIcon" />;
+        case "E":
+            return <ErrorIcon data-testid="ErrorIcon" />;
+        case "W":
+            return <WarningIcon data-testid="WarningIcon" />;
+        case "I":
+            return <InfoIcon data-testid="InfoIcon" />;
+        default:
+            return "❓";
+    }
+};
+
 const status2Color = (status: string): "error" | "info" | "success" | "warning" => {
     status = (status || "").toLowerCase();
     status = status.length == 0 ? " " : status.charAt(0);
@@ -54,7 +73,7 @@ const Status = (props: StatusProps) => {
     const chipProps = useMemo(() => {
         const cp: Record<string, unknown> = {};
         cp.color = status2Color(value.status);
-        cp.avatar = <Avatar sx={{ bgcolor: `${cp.color}.main` }}>{getInitials(value.status)}</Avatar>;
+        cp.avatar = <Avatar sx={{ bgcolor: `${cp.color}.main` }}>{getStatusIcon(getInitials(value.status))}</Avatar>;
         if (props.onClose) {
             cp.onDelete = props.onClose;
         }
diff --git a/frontend/taipy-gui/src/components/Taipy/StatusList.spec.tsx b/frontend/taipy-gui/src/components/Taipy/StatusList.spec.tsx
index 18ea804924..494aa91ee8 100644
--- a/frontend/taipy-gui/src/components/Taipy/StatusList.spec.tsx
+++ b/frontend/taipy-gui/src/components/Taipy/StatusList.spec.tsx
@@ -12,60 +12,57 @@
  */
 
 import React from "react";
-import {render} from "@testing-library/react";
+import { render } from "@testing-library/react";
 import "@testing-library/jest-dom";
 import userEvent from "@testing-library/user-event";
 
 import { StatusType } from "./Status";
-import StatusList from './StatusList';
+import StatusList from "./StatusList";
 
 const statuses = [
-    {status: "info", message: "info"},
+    { status: "info", message: "info" },
     ["error", "error"],
-    {status: "warning", message: "warning"},
-    {status: "success", message: "success"},
+    { status: "warning", message: "warning" },
+    { status: "success", message: "success" },
 ] as Array<[string, string] | StatusType>;
 
 describe("StatusList Component", () => {
     it("renders", async () => {
-        const {getByText} = render(<StatusList value={statuses} />);
+        const { getByText } = render(<StatusList value={statuses} />);
         const elt = getByText("4 statuses");
-        const av = getByText("E");
         expect(elt.tagName).toBe("SPAN");
-        expect(av.tagName).toBe("DIV");
-    })
+    });
     it("uses the class", async () => {
-        const {getByText} = render(<StatusList value={statuses} className="taipy-status" />);
+        const { getByText } = render(<StatusList value={statuses} className="taipy-status" />);
         const elt = getByText("4 statuses");
         expect(elt.parentElement).toHaveClass("taipy-status");
-    })
+    });
     it("can be opened when more than 1 status", async () => {
-        const {getByTestId} = render(<StatusList value={statuses} />);
+        const { getByTestId } = render(<StatusList value={statuses} />);
         const elt = getByTestId("ArrowDownwardIcon");
-    })
+    });
     it("cannot be opened when 1 status", async () => {
-        const {queryAllByRole} = render(<StatusList value={statuses[0]} />);
+        const { queryAllByRole } = render(<StatusList value={statuses[0]} />);
         expect(queryAllByRole("button")).toHaveLength(0);
-    })
+    });
     it("displays a default status", async () => {
-        const {getByText} = render(<StatusList value={[]}  />);
+        const { getByText } = render(<StatusList value={[]} />);
         getByText("No Status");
-        getByText("I");
-    })
+    });
     it("opens on click", async () => {
-        const {getByTestId, getByText} = render(<StatusList value={statuses} />);
+        const { getByTestId, getByText } = render(<StatusList value={statuses} />);
         const elt = getByTestId("ArrowDownwardIcon");
         await userEvent.click(elt);
         const selt = getByText("info");
         expect(selt.parentElement?.parentElement?.childElementCount).toBe(4);
-    })
+    });
     it("hide closed statuses", async () => {
-        const {getByTestId, queryAllByTestId} = render(<StatusList value={statuses} />);
+        const { getByTestId, queryAllByTestId } = render(<StatusList value={statuses} />);
         const elt = getByTestId("ArrowDownwardIcon");
         await userEvent.click(elt);
         const icons = queryAllByTestId("CancelIcon");
         expect(icons).toHaveLength(4);
         await userEvent.click(icons[0]);
         expect(queryAllByTestId("CancelIcon")).toHaveLength(3);
-    })
+    });
 });