diff --git a/frontend/components/ui/Tooltip.vue b/frontend/components/ui/Tooltip.vue
new file mode 100644
index 0000000..54ba536
--- /dev/null
+++ b/frontend/components/ui/Tooltip.vue
@@ -0,0 +1,38 @@
+<script lang="ts" setup>
+
+// type
+type Props = {
+    title?: string
+}
+
+// prop
+const props = defineProps<Props>();
+const { title } = toRefs(props);
+
+</script>
+
+<template>
+    <TooltipProvider
+        :disabled="!title"
+        :delay-duration="0"
+    >
+        <TooltipRoot>
+            <TooltipTrigger>
+                <slot />
+            </TooltipTrigger>
+            <TooltipPortal>
+                <TooltipContent
+                    class="bg-black text-white px-4 py-3 rounded-full"
+                    :side-offset="5"
+                >
+                    {{ title }}
+                    <TooltipArrow
+                        class="fill-black"
+                        :width="12"
+                        :height="6"
+                    />
+                </TooltipContent>
+            </TooltipPortal>
+        </TooltipRoot>
+    </TooltipProvider>
+</template>
\ No newline at end of file