diff --git a/components/Footer/Footer.tsx b/components/Footer/Footer.tsx
index 924d856da..b5bb7e6a4 100644
--- a/components/Footer/Footer.tsx
+++ b/components/Footer/Footer.tsx
@@ -1,7 +1,15 @@
 import Link from 'next/link'
 import type { FC } from 'react'
+import { useTheme } from 'next-themes'
 
 export const Footer: FC = () => {
+  const { resolvedTheme } = useTheme()
+  const isDarkMode = resolvedTheme === 'dark'
+
+  const nameStyles = `underline ${
+    isDarkMode ? 'text-gray-200' : 'text-violet-700'
+  } `
+
   return (
     <footer className="z-10 mb-4 flex w-full items-baseline justify-center rounded-lg py-2 backdrop-blur-md sm:py-3">
       <p className="leading-7 tracking-wide text-center text-black dark:text-violet-400">
@@ -12,7 +20,7 @@ export const Footer: FC = () => {
           target="_blank"
           rel="noopener noreferrer"
         >
-          <span className="dark:text-gray-200 underline">Rupali Haldiya</span>
+          <span className={nameStyles}>Rupali Haldiya</span>
         </Link>{' '}
         and{' '}
         <Link
@@ -20,9 +28,7 @@ export const Footer: FC = () => {
           target="_blank"
           rel="noopener noreferrer"
         >
-          <span className="dark:text-gray-200 underline">
-            Open Source Community
-          </span>
+          <span className={nameStyles}>Open Source Community</span>
         </Link>
       </p>
     </footer>