diff --git a/client/templates/Gengar/widgets/Masthead.tsx b/client/templates/Gengar/widgets/Masthead.tsx
index 8b41edc8..90af0dc9 100644
--- a/client/templates/Gengar/widgets/Masthead.tsx
+++ b/client/templates/Gengar/widgets/Masthead.tsx
@@ -83,7 +83,7 @@ export const MastheadSidebar: React.FC = () => {
             icon={getProfileIcon(network)}
             link={url && addHttp(url)}
             className="!gap-2 text-xs"
-            textClassName="invert"
+            textClassName={clsx({ invert: contrast === 'light' })}
           >
             {username}
           </DataDisplay>
diff --git a/client/templates/shared/DataDisplay.tsx b/client/templates/shared/DataDisplay.tsx
index f085a131..421a9db2 100644
--- a/client/templates/shared/DataDisplay.tsx
+++ b/client/templates/shared/DataDisplay.tsx
@@ -15,7 +15,7 @@ const DataDisplay: React.FC<React.PropsWithChildren<Props>> = ({ icon, link, cla
     return (
       <div className={clsx('inline-flex items-center gap-1', className)}>
         {icon}
-        <a href={link} target="_blank" rel="noreferrer" className={textClassName}>
+        <a href={link} target="_blank" rel="noreferrer" className="{textClassName}">
           {children}
         </a>
       </div>