diff --git a/components/gql_node_renderer/nodes/Link.jsx b/components/gql_node_renderer/nodes/Link.jsx
index e25ff0a50b..8c9eeceb38 100644
--- a/components/gql_node_renderer/nodes/Link.jsx
+++ b/components/gql_node_renderer/nodes/Link.jsx
@@ -1,6 +1,9 @@
 export default function Link(props) {
   return (
-    <a href={props.node.data.href} className="underline">
+    <a
+      href={props.node.data.href}
+      className="underline underline-offset-[6px] text-custom-blue-projects-link hover:text-custom-blue-projects-link-hover"
+    >
       {props.node.value}
     </a>
   );
diff --git a/components/molecules/Card.js b/components/molecules/Card.js
index 0fc8c6c469..c3fbbf8c7f 100644
--- a/components/molecules/Card.js
+++ b/components/molecules/Card.js
@@ -38,7 +38,7 @@ export const Card = (props) => {
           ""
         )}
         <div className="flex">
-          <p className="block font-display text-lg text-custom-blue-projects-link font-bold underline underline-offset-4 my-1 py-2 px-6 items-center group-hover:no-underline group-hover:text-custom-blue-projects-link-hover">
+          <p className="block font-display text-lg text-custom-blue-projects-link font-bold underline underline-offset-[6px] my-1 py-2 px-6 items-center group-hover:text-custom-blue-projects-link-hover">
             {props.title}
             {props.showIcon ? (
               props.href.substring(0, 8) === "https://" ? (