diff --git a/src/frontend/src/components/items/StylishText.tsx b/src/frontend/src/components/items/StylishText.tsx
index 040f9a9258..946e9f49e5 100644
--- a/src/frontend/src/components/items/StylishText.tsx
+++ b/src/frontend/src/components/items/StylishText.tsx
@@ -1,4 +1,4 @@
-import { Text } from '@mantine/core';
+import { Text, useMantineTheme } from '@mantine/core';
 
 import * as classes from '../../main.css';
 
@@ -9,8 +9,10 @@ export function StylishText({
   children: JSX.Element | string;
   size?: string;
 }>) {
+  const theme = useMantineTheme();
+
   return (
-    <Text size={size} className={classes.signText} variant='gradient'>
+    <Text size={size} className={classes.signText} c={theme.primaryColor}>
       {children}
     </Text>
   );