diff --git a/components/archive/card.vue b/components/archive/card.vue
index f47963d..f01d27a 100644
--- a/components/archive/card.vue
+++ b/components/archive/card.vue
@@ -49,7 +49,7 @@ withDefaults(defineProps<Props>(), {
           </div>
           <div class="flex items-center gap-1 flex-wrap">
             <LogoTag />
-            <p v-for="tag in tags" :key="tag">
+            <p v-for="tag in tags" :key="tag" class="bg-gray-200 dark:bg-slate-900 rounded-md px-2 py-1 font-semibold">
               {{ tag }}
             </p>
           </div>
diff --git a/components/blog/card.vue b/components/blog/card.vue
index ae12ce7..3205f14 100644
--- a/components/blog/card.vue
+++ b/components/blog/card.vue
@@ -42,7 +42,7 @@ withDefaults(defineProps<Props>(), {
           <div class="flex items-center gap-1 flex-wrap">
             <LogoTag />
             <template v-for="tag in tags" :key="tag">
-              <span>{{ tag }}</span>
+              <span class="bg-gray-200 dark:bg-slate-900 rounded-md px-2 py-1 font-semibold">{{ tag }}</span>
             </template>
           </div>
         </div>