diff --git a/apps/web/components/ui/Text/Largetitle/Largetitle.tsx b/apps/web/components/ui/Text/Largetitle/Largetitle.tsx
index 7eeff016..ec341614 100644
--- a/apps/web/components/ui/Text/Largetitle/Largetitle.tsx
+++ b/apps/web/components/ui/Text/Largetitle/Largetitle.tsx
@@ -4,10 +4,7 @@ import React from "react";
 import { TextProps } from "../Text";
 
 const Largetitle: React.FunctionComponent<TextProps> = (props: TextProps) => {
-  const classes = classnames(
-    "font-cal tracking-wider text-3xl text-gray-900 dark:text-white mb-2",
-    props?.className
-  );
+  const classes = classnames("font-cal tracking-wider text-3xl mb-2", props?.className);
 
   return <p className={classes}>{props?.text || props.children}</p>;
 };
diff --git a/apps/web/components/ui/Text/Text.tsx b/apps/web/components/ui/Text/Text.tsx
index e5fcb72a..07debdf7 100644
--- a/apps/web/components/ui/Text/Text.tsx
+++ b/apps/web/components/ui/Text/Text.tsx
@@ -1,3 +1,6 @@
+/**
+ * @deprecated create new a new set of components, waiting for designs
+ */
 import React from "react";
 
 import Body from "./Body";
diff --git a/apps/web/pages/team/[slug].tsx b/apps/web/pages/team/[slug].tsx
index 47266e75..385a5aff 100644
--- a/apps/web/pages/team/[slug].tsx
+++ b/apps/web/pages/team/[slug].tsx
@@ -74,7 +74,9 @@ function TeamPage({ team }: TeamPageProps) {
               imageSrc={getPlaceholderAvatar(team.logo, team.name)}
               className="mx-auto mb-4 h-20 w-20 rounded-full"
             />
-            <Text variant="largetitle">{teamName}</Text>
+            <Text variant="largetitle" className="text-gray-900 dark:text-white">
+              {teamName}
+            </Text>
             <Text variant="subtitle" className="mt-2">
               {team.bio}
             </Text>