diff --git a/src/.vuepress/theme/components/blog/PostAuthor.vue b/src/.vuepress/theme/components/blog/PostAuthor.vue
index b41ffa48..6d423f0c 100644
--- a/src/.vuepress/theme/components/blog/PostAuthor.vue
+++ b/src/.vuepress/theme/components/blog/PostAuthor.vue
@@ -11,10 +11,7 @@
       itemprop="name"
       class="flex flex-row"
     >
-      <span
-        class="hover:text-blueGreen hover:underline cursor-pointer"
-        @click="handleAuthorClick(piece)"
-      >
+      <span :class="computedClassName" @click="handleAuthorClick(piece)">
         {{ piece }}
       </span>
       <span>{{
@@ -35,6 +32,12 @@ export default {
   name: 'PostAuthor',
   components: {},
   mixins: [Author],
+  props: {
+    light: {
+      type: Boolean,
+      default: null,
+    },
+  },
   computed: {
     ...mapState('appState', ['activeAuthor']),
     resolvedAuthorName() {
@@ -47,6 +50,12 @@ export default {
 
       return resolvedName.split(/[,&]/g)
     },
+    computedClassName() {
+      return [
+        'hover:underline cursor-pointer',
+        this.light ? 'text-blueGreenLight' : 'hover:text-blueGreen',
+      ]
+    },
   },
   methods: {
     handleAuthorClick(piece) {
diff --git a/src/.vuepress/theme/components/blog/PostHero.vue b/src/.vuepress/theme/components/blog/PostHero.vue
index 787b51a7..a1096d59 100644
--- a/src/.vuepress/theme/components/blog/PostHero.vue
+++ b/src/.vuepress/theme/components/blog/PostHero.vue
@@ -10,7 +10,7 @@
               v-if="author && author.name"
               :to="{ path: $localePath, query: { author: author.name } }"
             >
-              <PostAuthor v-bind="author" />
+              <PostAuthor v-bind="author" light />
             </router-link>
             <time
               class="text-gray"