diff --git a/apps/web/src/app/[lang]/page.tsx b/apps/web/src/app/[lang]/page.tsx
index b6313e6..2a4938e 100644
--- a/apps/web/src/app/[lang]/page.tsx
+++ b/apps/web/src/app/[lang]/page.tsx
@@ -17,7 +17,7 @@ export default async function Index({ params: { lang } }: PageProps) {
   return (
     <div className="w-full px-6 py-4 overflow-auto">
       <Container>
-        <Heading className="mb-4" size="9" color="primary" weight="medium" align="center">All your spaces, in one place</Heading>
+        <Heading className="mb-4" size="8" color="secondary" weight="medium" align="center">All your spaces, in one place</Heading>
         <div data-testid="dho-list-container" className="w-full">
           {daos.map((dao) => (
             <div key={dao.name} className="mb-5">
diff --git a/packages/ui/src/atoms/heading/index.tsx b/packages/ui/src/atoms/heading/index.tsx
index 15e4192..633c335 100644
--- a/packages/ui/src/atoms/heading/index.tsx
+++ b/packages/ui/src/atoms/heading/index.tsx
@@ -28,8 +28,8 @@ const headingVariants = cva(
         right: 'text-right',
       },
       color: {
-        primary: 'text-white',
-        secondary: 'text-gray-500',
+        primary: 'text-primary-foreground',
+        secondary: 'text-secondary-foreground',
       },
     },
     defaultVariants: {