diff --git a/components/blog/Header.vue b/components/blog/Header.vue
index d628fd0..80fc31a 100644
--- a/components/blog/Header.vue
+++ b/components/blog/Header.vue
@@ -43,9 +43,12 @@ withDefaults(defineProps<Props>(), {
         <div class="flex items-center gap-2 flex-wrap my-5">
           <LogoTag />
           <template v-for="tag in tags" :key="tag">
-            <span class="bg-gray-200 dark:bg-slate-900 rounded-md px-2 py-1 font-semibold">{{
-              tag
-            }}</span>
+            <NuxtLink :to="`/categories/${tag.toLocaleLowerCase()}`">
+              <span
+                class="bg-gray-200 dark:bg-slate-900 rounded-md px-2 py-1 font-semibold hover:bg-gray-300 dark:hover:bg-slate-800 transition-colors duration-200"
+                >{{ tag }}</span
+              >
+            </NuxtLink>
           </template>
         </div>
       </div>