diff --git a/components/Header/Header.jsx b/components/Header/Header.jsx
index 7fed443a..dc68f2bb 100644
--- a/components/Header/Header.jsx
+++ b/components/Header/Header.jsx
@@ -166,7 +166,7 @@ const Header = () => {
                     target="_blank"
                     title="Youtube Channel"
                     id="youtube-channel"
-                    className={`cursor-pointer  text-[#ffffff] hover:text-[--site-theme-color] transform ease-in-out hover:-translate-y+1 hover:scale-150`}
+                    className={`cursor-pointer  text-[#ffffff] hover:text-red-600 transform ease-in-out hover:-translate-y+1 hover:scale-150`}
                     rel="noreferrer"
                   >
                     <RiYoutubeFill />
@@ -188,7 +188,7 @@ const Header = () => {
                     target="_blank"
                     title="Twitter Account"
                     id="twitter-account"
-                    className={`cursor-pointer text-[#ffffff] hover:text-[--site-theme-color] transform ease-in-out hover:-translate-y+1 hover:scale-150`}
+                    className={`cursor-pointer text-[#ffffff] hover:text-blue-400 transform ease-in-out hover:-translate-y+1 hover:scale-150`}
                     rel="noreferrer"
                   >
                     <RiTwitterFill />
@@ -199,7 +199,7 @@ const Header = () => {
                     target="_blank"
                     title="LinkedIn Account"
                     id="linkedin-account"
-                    className={`cursor-pointer text-[#ffffff] hover:text-[--site-theme-color] transform ease-in-out hover:-translate-y+1 hover:scale-150`}
+                    className={`cursor-pointer text-[#ffffff] hover:text-blue-400 transform ease-in-out hover:-translate-y+1 hover:scale-150`}
                     rel="noreferrer"
                   >
                     <RiLinkedinFill />
diff --git a/components/UI/Contact.jsx b/components/UI/Contact.jsx
index 412bb121..ca93dbd3 100644
--- a/components/UI/Contact.jsx
+++ b/components/UI/Contact.jsx
@@ -61,7 +61,7 @@ const Contact = () => {
 
             <div className={`${classes.social__links}`}>
               <Link
-                className="hover:text-[#01d293] duration-300"
+                className="hover:text-red-600 duration-300"
                 aria-label="Youtube Channel"
                 href="https://youtube.com/@piyushgargdev"
                 target="_blank"
@@ -77,7 +77,7 @@ const Contact = () => {
                 <RiGithubFill />
               </Link>
               <Link
-                className="hover:text-[#01d293] duration-300"
+                className="hover:text-blue-400 duration-300"
                 aria-label="Twitter Account"
                 href="https://twitter.com/piyushgarg_dev"
                 target="_blank"
@@ -85,7 +85,7 @@ const Contact = () => {
                 <RiTwitterFill />
               </Link>
               <Link
-                className="hover:text-[#01d293] duration-300"
+                className="hover:text-blue-400 duration-300"
                 aria-label="LinedIn Account"
                 href="https://www.linkedin.com/in/piyushgarg195/"
                 target="_blank"
diff --git a/styles/contact.module.css b/styles/contact.module.css
index 34f193e8..fd56932c 100644
--- a/styles/contact.module.css
+++ b/styles/contact.module.css
@@ -36,9 +36,9 @@
   font-size: 1.3rem !important;
 }
 
-.social__links :hover {
+/* .social__links :hover {
   color: var(--site-theme-color);
-}
+} */
 
 @media only screen and (max-width: 768px) {
   .social__links {