diff --git a/webui/src/features/notifications/NotificationSummaryWidget.tsx b/webui/src/features/notifications/NotificationSummaryWidget.tsx
index e51b987..2071312 100644
--- a/webui/src/features/notifications/NotificationSummaryWidget.tsx
+++ b/webui/src/features/notifications/NotificationSummaryWidget.tsx
@@ -1,3 +1,4 @@
+import { MetricGrid } from "@govoplan/core-webui";
 import { Link } from "react-router";
 import {
   DismissibleAlert,
@@ -40,7 +41,7 @@ export default function NotificationSummaryWidget({
           {error}
         </DismissibleAlert>
       )}
-      <div className="metric-grid inside dashboard-widget-metrics">
+      <MetricGrid columns={3} spacing="none">
         <MetricCard
           label="i18n:govoplan-notifications.unread"
           value={summary?.unread ?? 0}
@@ -63,7 +64,7 @@ export default function NotificationSummaryWidget({
             detail="i18n:govoplan-notifications.delivery_failures"
           />
         )}
-      </div>
+      </MetricGrid>
       <div className="notifications-widget-actions">
         <DocumentationHelpLink reference={NOTIFICATIONS_DOCUMENTATION} />
         {showCenterLink && (