diff --git a/src/app/(dashboard)/dashboard/radar/page.tsx b/src/app/(dashboard)/dashboard/radar/page.tsx
index 4fc4cbe44d..5dd4b81ba6 100644
--- a/src/app/(dashboard)/dashboard/radar/page.tsx
+++ b/src/app/(dashboard)/dashboard/radar/page.tsx
@@ -392,7 +392,12 @@ export default function RadarPage() {
           {pageState === "optin_pending" && (
             <Card>
               <div className="mx-auto flex max-w-5xl flex-col items-center gap-6 py-8 text-center">
-                <div className="text-4xl">📡</div>
+                <span
+                  aria-hidden="true"
+                  className="material-symbols-outlined text-4xl text-violet-400"
+                >
+                  radar
+                </span>
                 <h2 className="text-xl font-semibold">{t("activateTitle")}</h2>
                 <p className="max-w-2xl text-text-muted">{t("activateDescription")}</p>
 
diff --git a/tests/unit/radar-optin-page.test.tsx b/tests/unit/radar-optin-page.test.tsx
index 86416ffc5b..bcf537896e 100644
--- a/tests/unit/radar-optin-page.test.tsx
+++ b/tests/unit/radar-optin-page.test.tsx
@@ -104,6 +104,11 @@ describe("Radar opt-in page", () => {
     expect(notFoundMock).not.toHaveBeenCalled();
     expect(container.textContent).toContain("activateTitle");
     expect(container.textContent).toContain("activateButton");
+    const activationIcon = container.querySelector(
+      'span.material-symbols-outlined[aria-hidden="true"]'
+    );
+    expect(activationIcon?.textContent).toBe("radar");
+    expect(container.textContent).not.toContain("📡");
   });
 
   it("shows the complete access and privacy explanation before every activation action", async () => {