diff --git a/static/app/components/devtoolbar/components/alerts/alertBadge.tsx b/static/app/components/devtoolbar/components/alerts/alertBadge.tsx
new file mode 100644
index 00000000000000..a3d85ebfe5cb6d
--- /dev/null
+++ b/static/app/components/devtoolbar/components/alerts/alertBadge.tsx
@@ -0,0 +1,12 @@
+import IndicatorBadge from 'sentry/components/devtoolbar/components/indicatorBadge';
+
+import useAlertsCount from './useAlertsCount';
+
+export default function AlertBadge() {
+  const {data: count} = useAlertsCount();
+
+  if (count === undefined || count < 1) {
+    return null;
+  }
+  return <IndicatorBadge variant="red" />;
+}
diff --git a/static/app/components/devtoolbar/components/alerts/alertCountBadge.tsx b/static/app/components/devtoolbar/components/alerts/alertCountBadge.tsx
deleted file mode 100644
index 565fee448e0fed..00000000000000
--- a/static/app/components/devtoolbar/components/alerts/alertCountBadge.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import CountBadge from '../countBadge';
-
-import useAlertsCount from './useAlertsCount';
-
-export default function AlertCountBadge() {
-  const {data: count} = useAlertsCount();
-
-  if (count === undefined) {
-    return null;
-  }
-  return <CountBadge value={count} variant="red" />;
-}
diff --git a/static/app/components/devtoolbar/components/indicatorBadge.tsx b/static/app/components/devtoolbar/components/indicatorBadge.tsx
index f5cc67d9d586ea..cc2bd91204207d 100644
--- a/static/app/components/devtoolbar/components/indicatorBadge.tsx
+++ b/static/app/components/devtoolbar/components/indicatorBadge.tsx
@@ -1,4 +1,3 @@
-import type React from 'react';
 import {css} from '@emotion/react';
 
 import {smallCss} from '../styles/typography';
@@ -11,26 +10,25 @@ const variants = {
 };
 
 interface Props {
-  icon: React.ReactNode;
   variant: keyof typeof variants;
 }
 
-export default function IndicatorBadge({icon, variant}: Props) {
-  return <div css={[smallCss, counterCss, variants[variant]]}>{icon}</div>;
+export default function IndicatorBadge({variant}: Props) {
+  return <div css={[smallCss, badgeCss, variants[variant]]} />;
 }
 
-const counterCss = css`
+const badgeCss = css`
   background: var(--red400);
   border-radius: 50%;
   border: 1px solid transparent;
   box-sizing: content-box;
   color: var(--gray100);
-  height: 1rem;
+  height: 0.55rem;
   line-height: 1rem;
   position: absolute;
-  right: -6px;
-  top: -6px;
-  width: 1rem;
+  right: 2px;
+  top: 18px;
+  width: 0.55rem;
   display: flex;
   align-items: center;
   justify-content: center;
diff --git a/static/app/components/devtoolbar/components/navigation.tsx b/static/app/components/devtoolbar/components/navigation.tsx
index 9ccc55b080acc2..ef9ab29a21d689 100644
--- a/static/app/components/devtoolbar/components/navigation.tsx
+++ b/static/app/components/devtoolbar/components/navigation.tsx
@@ -18,7 +18,7 @@ import useToolbarRoute from '../hooks/useToolbarRoute';
 import {navigationCss} from '../styles/navigation';
 import {resetDialogCss} from '../styles/reset';
 
-import AlertCountBadge from './alerts/alertCountBadge';
+import AlertBadge from './alerts/alertBadge';
 import IconButton from './navigation/iconButton';
 
 export default function Navigation({
@@ -55,7 +55,7 @@ export default function Navigation({
       <NavButton panelName="issues" label="Issues" icon={<IconIssues />} />
       <NavButton panelName="feedback" label="User Feedback" icon={<IconMegaphone />} />
       <NavButton panelName="alerts" label="Active Alerts" icon={<IconSiren />}>
-        <AlertCountBadge />
+        <AlertBadge />
       </NavButton>
       <NavButton panelName="featureFlags" label="Feature Flags" icon={<IconFlag />} />
       <NavButton panelName="releases" label="Releases" icon={<IconReleases />}>
diff --git a/static/app/components/devtoolbar/components/releases/sessionStatusBadge.tsx b/static/app/components/devtoolbar/components/releases/sessionStatusBadge.tsx
index 03b50e37ef3a87..8d2fe9b85e90f4 100644
--- a/static/app/components/devtoolbar/components/releases/sessionStatusBadge.tsx
+++ b/static/app/components/devtoolbar/components/releases/sessionStatusBadge.tsx
@@ -1,6 +1,5 @@
 import IndicatorBadge from 'sentry/components/devtoolbar/components/indicatorBadge';
 import useSessionStatus from 'sentry/components/devtoolbar/components/releases/useSessionStatus';
-import {IconFire} from 'sentry/icons';
 
 export default function CrashCountBadge() {
   const {data} = useSessionStatus();
@@ -18,7 +17,7 @@ export default function CrashCountBadge() {
 
   // over 10% of sessions were crashes
   if (crashPercent > 10) {
-    return <IndicatorBadge icon={<IconFire size="xs" />} variant="red" />;
+    return <IndicatorBadge variant="red" />;
   }
   return null;
 }