diff --git a/src/frontend/src/primitives/A.tsx b/src/frontend/src/primitives/A.tsx
index 31a49017..637af588 100644
--- a/src/frontend/src/primitives/A.tsx
+++ b/src/frontend/src/primitives/A.tsx
@@ -51,6 +51,11 @@ const link = cva({
         lineHeight: '1rem',
       },
     },
+    color: {
+      primary: {
+        color: 'blue',
+      },
+    },
   },
 })
 
@@ -64,12 +69,13 @@ export const A = ({
   externalIcon,
   underline,
   footer,
+  color,
   ...props
 }: AProps) => {
   return (
     <Link
       {...props}
-      className={link({ size, externalIcon, underline, footer })}
+      className={link({ size, externalIcon, underline, footer, color })}
     />
   )
 }