diff --git a/web/components/contract/contract-card.tsx b/web/components/contract/contract-card.tsx
index 2390ffc6..266d1fc2 100644
--- a/web/components/contract/contract-card.tsx
+++ b/web/components/contract/contract-card.tsx
@@ -67,7 +67,7 @@ export function ContractCard(props: {
             </div>
             <AvatarDetails contract={contract} />
             <p
-              className="break-words font-medium text-indigo-700 peer-hover:underline peer-hover:decoration-indigo-400 peer-hover:decoration-2"
+              className="break-words font-semibold text-indigo-700 peer-hover:underline peer-hover:decoration-indigo-400 peer-hover:decoration-2"
               style={{ /* For iOS safari */ wordBreak: 'break-word' }}
             >
               {question}
diff --git a/web/components/contract/contract-details.tsx b/web/components/contract/contract-details.tsx
index ed07e409..0ec082d8 100644
--- a/web/components/contract/contract-details.tsx
+++ b/web/components/contract/contract-details.tsx
@@ -71,7 +71,7 @@ export function AvatarDetails(props: { contract: Contract }) {
   const { creatorName, creatorUsername } = contract
 
   return (
-    <Row className="items-center gap-2 text-sm text-gray-500">
+    <Row className="items-center gap-2 text-sm text-gray-400">
       <Avatar
         username={creatorUsername}
         avatarUrl={contract.creatorAvatarUrl}