diff --git a/web/src/components/OAuthLoginModal.tsx b/web/src/components/OAuthLoginModal.tsx
index e34047387d..66c78139ef 100644
--- a/web/src/components/OAuthLoginModal.tsx
+++ b/web/src/components/OAuthLoginModal.tsx
@@ -1,6 +1,6 @@
 import { useEffect, useRef, useState } from "react";
 import { ExternalLink, Copy, X, Check, Loader2 } from "lucide-react";
-import { Typography } from "@nous-research/ui";
+import { H2 } from "@nous-research/ui";
 import { api, type OAuthProvider, type OAuthStartResponse } from "@/lib/api";
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
@@ -194,14 +194,14 @@ export function OAuthLoginModal({
         </button>
         <div className="p-6 flex flex-col gap-4">
           <div>
-            <Typography
-              as="h2"
-              mondwest
+            <H2
               id="oauth-modal-title"
-              className="text-base tracking-wider uppercase"
+              variant="sm"
+              mondwest
+              className="tracking-wider uppercase"
             >
               {t.oauth.connect} {provider.name}
-            </Typography>
+            </H2>
             {secondsLeft !== null &&
               phase !== "approved" &&
               phase !== "error" && (