diff --git a/src/frontend/src/components/primitives/DialogModal.vue b/src/frontend/src/components/primitives/DialogModal.vue
new file mode 100644
index 00000000..c22200c3
--- /dev/null
+++ b/src/frontend/src/components/primitives/DialogModal.vue
@@ -0,0 +1,38 @@
+<!-- Primitive UI Component: DialogModal (WBS-COMP-1.3) -->
+<template>
+  <Teleport to="body">
+    <div v-if="isOpen" class="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/50 backdrop-blur-xs select-none">
+      <div class="bg-white rounded-lg border border-slate-300 shadow-xl w-full max-w-md overflow-hidden flex flex-col animate-in fade-in zoom-in-95 duration-150">
+        <!-- Header -->
+        <div class="bg-slate-900 text-white px-4 py-3 flex justify-between items-center text-sm font-bold">
+          <span>{{ title || '확인' }}</span>
+          <button type="button" class="text-slate-400 hover:text-white font-bold" @click="$emit('close')">✕</button>
+        </div>
+
+        <!-- Body -->
+        <div class="p-5 text-xs text-slate-800 leading-relaxed">
+          <slot></slot>
+        </div>
+
+        <!-- Footer -->
+        <div class="bg-slate-100 px-4 py-2.5 border-t border-slate-200 flex justify-end gap-2 text-xs">
+          <button type="button" class="px-3 py-1.5 bg-slate-200 hover:bg-slate-300 text-slate-800 font-bold rounded transition" @click="$emit('close')">
+            취소
+          </button>
+          <button type="button" class="px-3 py-1.5 bg-blue-600 hover:bg-blue-700 text-white font-bold rounded transition shadow-xs" @click="$emit('confirm')">
+            확인
+          </button>
+        </div>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+  isOpen: boolean;
+  title?: string;
+}>();
+
+defineEmits(['close', 'confirm']);
+</script>
diff --git a/src/frontend/src/components/primitives/SelectInput.vue b/src/frontend/src/components/primitives/SelectInput.vue
new file mode 100644
index 00000000..e60ffef2
--- /dev/null
+++ b/src/frontend/src/components/primitives/SelectInput.vue
@@ -0,0 +1,27 @@
+<!-- Primitive UI Component: SelectInput (WBS-COMP-1.2) -->
+<template>
+  <div class="primitive-select-wrapper w-full">
+    <select
+      :id="id"
+      :value="modelValue"
+      :disabled="disabled"
+      class="primitive-select w-full h-9 px-3 border border-slate-300 rounded text-xs text-slate-900 font-medium bg-white focus:ring-2 focus:ring-blue-500 focus:border-blue-500 focus:outline-none disabled:bg-slate-100 disabled:text-slate-500 disabled:cursor-not-allowed"
+      @change="$emit('update:modelValue', ($event.target as HTMLSelectElement).value)"
+    >
+      <option v-for="opt in options" :key="opt" :value="opt">
+        {{ opt }}
+      </option>
+    </select>
+  </div>
+</template>
+
+<script setup lang="ts">
+defineProps<{
+  id?: string;
+  modelValue?: string | number;
+  options: string[];
+  disabled?: boolean;
+}>();
+
+defineEmits(['update:modelValue']);
+</script>