diff --git a/frontend/src/routes/documents/[id]/+page.svelte b/frontend/src/routes/documents/[id]/+page.svelte
index f9a01a9..c3e667c 100644
--- a/frontend/src/routes/documents/[id]/+page.svelte
+++ b/frontend/src/routes/documents/[id]/+page.svelte
@@ -4,6 +4,7 @@
   import { api, getAccessToken } from '$lib/api';
   import { addToast } from '$lib/stores/ui';
   import { marked } from 'marked';
+  import TagPill from '$lib/components/TagPill.svelte';
 
   let doc = null;
   let loading = true;
@@ -119,7 +120,7 @@
             <h3 class="text-sm font-semibold text-[var(--text-dim)] mb-2">태그</h3>
             <div class="flex flex-wrap gap-1.5">
               {#each doc.ai_tags as tag}
-                <span class="px-2 py-0.5 bg-[var(--bg)] rounded text-xs text-[var(--accent)]">{tag}</span>
+                <TagPill {tag} />
               {/each}
             </div>
           </div>