diff --git a/src/app/authors/AuthorsTabs.tsx b/src/app/authors/AuthorsTabs.tsx
index f8f3f79a..d2e04f00 100644
--- a/src/app/authors/AuthorsTabs.tsx
+++ b/src/app/authors/AuthorsTabs.tsx
@@ -18,6 +18,8 @@ const TABS = [
   { id: 'alumni',     label: 'Alumni' },
 ]
 
+const AUTHOR_PHOTO_CLASS = 'w-full h-full object-cover object-top grayscale group-hover:scale-[1.03] transition-transform duration-500'
+
 type Props = {
   heroTitle: string
   heroSubtitle: string
@@ -134,7 +136,7 @@ function LeaderCard({ author }: { author: typeof authors[number] }) {
             <img
               src={author.avatarPath}
               alt={author.name}
-              className="w-full h-full object-cover object-top group-hover:scale-[1.03] transition-transform duration-500"
+              className={AUTHOR_PHOTO_CLASS}
             />
           ) : (
             <div className="w-full h-full bg-gray-200" />
@@ -180,7 +182,7 @@ function AdvisorCard({ author }: { author: typeof authors[number] }) {
           <img
             src={author.avatarPath}
             alt={author.name}
-            className="w-full h-full object-cover object-top group-hover:scale-[1.03] transition-transform duration-500"
+            className={AUTHOR_PHOTO_CLASS}
           />
         ) : (
           <div className="w-full h-full bg-gray-200 flex items-center justify-center text-2xl font-semibold text-gray-400">
@@ -208,7 +210,7 @@ function AlumniCard({ author }: { author: typeof authors[number] }) {
           <img
             src={author.avatarPath}
             alt={author.name}
-            className="w-full h-full object-cover object-top group-hover:scale-[1.03] transition-transform duration-500"
+            className={AUTHOR_PHOTO_CLASS}
           />
         ) : (
           <div className="w-full h-full bg-gray-200" />
diff --git a/src/components/AuthorCard.tsx b/src/components/AuthorCard.tsx
index bc8ec905..13d773fd 100644
--- a/src/components/AuthorCard.tsx
+++ b/src/components/AuthorCard.tsx
@@ -21,7 +21,7 @@ export default function AuthorCard({ slug, variant = 'default' }: AuthorCardProp
         className="inline-flex items-center gap-4 py-3 px-5 rounded-2xl bg-gray-50 hover:bg-gray-100 border border-gray-100 hover:border-gray-200 transition-all no-underline group"
       >
         {avatar ? (
-          <img src={avatar} alt={name} className="w-12 h-12 rounded-full object-cover shrink-0 ring-2 ring-white shadow-sm" />
+          <img src={avatar} alt={name} className="w-12 h-12 rounded-full object-cover grayscale shrink-0 ring-2 ring-white shadow-sm" />
         ) : (
           <span className="w-12 h-12 rounded-full bg-gray-200 shrink-0 ring-2 ring-white shadow-sm flex items-center justify-center text-gray-400 text-lg font-medium">
             {name.charAt(0)}
@@ -43,7 +43,7 @@ export default function AuthorCard({ slug, variant = 'default' }: AuthorCardProp
         className="inline-flex items-center gap-3 py-2.5 px-4 rounded-xl bg-gray-50 hover:bg-gray-100 border border-gray-100 hover:border-gray-200 transition-all no-underline group"
       >
         {avatar ? (
-          <img src={avatar} alt={name} className="w-10 h-10 rounded-full object-cover shrink-0 ring-2 ring-white shadow-sm" />
+          <img src={avatar} alt={name} className="w-10 h-10 rounded-full object-cover grayscale shrink-0 ring-2 ring-white shadow-sm" />
         ) : (
           <span className="w-10 h-10 rounded-full bg-gray-200 shrink-0 ring-2 ring-white shadow-sm flex items-center justify-center text-gray-400 font-medium">
             {name.charAt(0)}
@@ -64,7 +64,7 @@ export default function AuthorCard({ slug, variant = 'default' }: AuthorCardProp
         className="inline-flex items-center gap-4 no-underline group"
       >
         {avatar ? (
-          <img src={avatar} alt={name} className="w-14 h-14 rounded-full object-cover shrink-0 ring-2 ring-gray-100" />
+          <img src={avatar} alt={name} className="w-14 h-14 rounded-full object-cover grayscale shrink-0 ring-2 ring-gray-100" />
         ) : (
           <span className="w-14 h-14 rounded-full bg-gray-200 shrink-0 ring-2 ring-gray-100 flex items-center justify-center text-gray-400 text-xl font-medium">
             {name.charAt(0)}
@@ -81,7 +81,7 @@ export default function AuthorCard({ slug, variant = 'default' }: AuthorCardProp
   return (
     <Link href={`/authors/${slug}`} className="inline-flex items-center gap-2.5 py-1.5 px-3 rounded-full border border-gray-200 hover:border-blue/40 transition-colors no-underline group">
       {avatar ? (
-        <img src={avatar} alt={name} className="w-6 h-6 rounded-full object-cover shrink-0" />
+        <img src={avatar} alt={name} className="w-6 h-6 rounded-full object-cover grayscale shrink-0" />
       ) : (
         <span className="w-6 h-6 rounded-full bg-gray-200 shrink-0" />
       )}