diff --git a/frontend/src/lib/components/UploadDropzone.svelte b/frontend/src/lib/components/UploadDropzone.svelte
new file mode 100644
index 0000000..47af868
--- /dev/null
+++ b/frontend/src/lib/components/UploadDropzone.svelte
@@ -0,0 +1,114 @@
+<script>
+  import { api } from '$lib/api';
+  import { addToast } from '$lib/stores/ui';
+  import { Upload } from 'lucide-svelte';
+
+  let { onupload = () => {} } = $props();
+
+  let dragging = $state(false);
+  let uploading = $state(false);
+  let uploadFiles = $state([]);
+  let dragCounter = 0;
+
+  function handleDragEnter(e) {
+    e.preventDefault();
+    dragCounter++;
+    dragging = true;
+  }
+
+  function handleDragLeave(e) {
+    e.preventDefault();
+    dragCounter--;
+    if (dragCounter <= 0) {
+      dragging = false;
+      dragCounter = 0;
+    }
+  }
+
+  function handleDragOver(e) {
+    e.preventDefault();
+  }
+
+  async function handleDrop(e) {
+    e.preventDefault();
+    dragging = false;
+    dragCounter = 0;
+
+    const files = Array.from(e.dataTransfer?.files || []);
+    if (files.length === 0) return;
+
+    uploading = true;
+    uploadFiles = files.map(f => ({ name: f.name, status: 'pending' }));
+
+    let success = 0;
+    let failed = 0;
+
+    for (let i = 0; i < files.length; i++) {
+      uploadFiles[i].status = 'uploading';
+      uploadFiles = [...uploadFiles];
+
+      try {
+        const formData = new FormData();
+        formData.append('file', files[i]);
+        await api('/documents/', { method: 'POST', body: formData });
+        uploadFiles[i].status = 'done';
+        success++;
+      } catch (err) {
+        uploadFiles[i].status = 'failed';
+        failed++;
+      }
+      uploadFiles = [...uploadFiles];
+    }
+
+    if (success > 0) {
+      addToast('success', `${success}건 업로드 완료${failed > 0 ? `, ${failed}건 실패` : ''}`);
+      onupload();
+    } else {
+      addToast('error', `업로드 실패 (${failed}건)`);
+    }
+
+    setTimeout(() => {
+      uploading = false;
+      uploadFiles = [];
+    }, 3000);
+  }
+</script>
+
+<svelte:document
+  on:dragenter={handleDragEnter}
+  on:dragleave={handleDragLeave}
+  on:dragover={handleDragOver}
+  on:drop={handleDrop}
+/>
+
+<!-- 전체 페이지 드래그 오버레이 -->
+{#if dragging}
+  <div class="fixed inset-0 z-50 bg-[var(--accent)]/10 border-2 border-dashed border-[var(--accent)] flex items-center justify-center pointer-events-none">
+    <div class="bg-[var(--surface)] rounded-xl px-8 py-6 shadow-xl text-center">
+      <Upload size={32} class="mx-auto mb-2 text-[var(--accent)]" />
+      <p class="text-sm font-medium text-[var(--accent)]">여기에 파일을 놓으세요</p>
+    </div>
+  </div>
+{/if}
+
+<!-- 업로드 진행 상태 -->
+{#if uploading && uploadFiles.length > 0}
+  <div class="mb-3 bg-[var(--surface)] border border-[var(--border)] rounded-lg p-3">
+    <p class="text-xs text-[var(--text-dim)] mb-2">업로드 중...</p>
+    <div class="space-y-1 max-h-32 overflow-y-auto">
+      {#each uploadFiles as f}
+        <div class="flex items-center justify-between text-xs">
+          <span class="truncate">{f.name}</span>
+          <span class={
+            f.status === 'done' ? 'text-[var(--success)]' :
+            f.status === 'failed' ? 'text-[var(--error)]' :
+            f.status === 'uploading' ? 'text-[var(--accent)]' :
+            'text-[var(--text-dim)]'
+          }>
+            {f.status === 'done' ? '✓' : f.status === 'failed' ? '✗' : f.status === 'uploading' ? '↑' : '…'}
+          </span>
+        </div>
+      {/each}
+    </div>
+  </div>
+{/if}
diff --git a/frontend/src/routes/documents/+page.svelte b/frontend/src/routes/documents/+page.svelte
index e7480ee..d4cf1f6 100644
--- a/frontend/src/routes/documents/+page.svelte
+++ b/frontend/src/routes/documents/+page.svelte
@@ -7,6 +7,7 @@
   import DocumentCard from '$lib/components/DocumentCard.svelte';
   import PreviewPanel from '$lib/components/PreviewPanel.svelte';
   import DocumentViewer from '$lib/components/DocumentViewer.svelte';
+  import UploadDropzone from '$lib/components/UploadDropzone.svelte';
 
   let documents = $state([]);
   let total = $state(0);
@@ -135,6 +136,9 @@
 <div class="flex flex-col h-full">
   <!-- 상단: 문서 목록 (30% when viewer active, 100% otherwise) -->
   <div class="overflow-y-auto px-4 py-3 {selectedDoc ? 'h-[30%] shrink-0 border-b border-[var(--border)]' : 'flex-1'}">
+    <!-- 업로드 드롭존 -->
+    <UploadDropzone onupload={loadDocuments} />
+
     <!-- 검색바 + 정보 버튼 -->
     <div class="flex gap-2 mb-3">
       <input