diff --git a/.changeset/true-taxes-vanish.md b/.changeset/true-taxes-vanish.md
new file mode 100644
index 00000000..8643f4d0
--- /dev/null
+++ b/.changeset/true-taxes-vanish.md
@@ -0,0 +1,5 @@
+---
+'@genseki/ui': patch
+---
+
+add background color for `dropzone`.
diff --git a/packages/ui/src/components/primitives/drop-zone.tsx b/packages/ui/src/components/primitives/drop-zone.tsx
index 96e39aa5..384dfb71 100644
--- a/packages/ui/src/components/primitives/drop-zone.tsx
+++ b/packages/ui/src/components/primitives/drop-zone.tsx
@@ -182,7 +182,7 @@ export const DropZoneArea = (
       data-file-dialog-active={dropzoneCtx.isFileDialogActive}
       data-disabled={dropzoneCtx.disabled}
       className={cn(
-        'group/dropzone relative h-auto w-full flex-col overflow-hidden rounded-md border border-dashed p-12',
+        'bg-background group/dropzone relative h-auto w-full flex-col overflow-hidden rounded-md border border-dashed p-12',
         'data-[drag-active=true]:ring-ring ring-offset-2 data-[drag-active=true]:outline-none data-[drag-active=true]:ring-[2px]',
         'data-[disabled=true]:bg-surface-primary-disabled',
         props.className
@@ -260,7 +260,7 @@ export const DropZoneEmptyUploadButton = ({
       variant="outline"
       asChild
       className={cn(
-        'group-data-[disabled=true]/dropzone:bg-surface-primary-disabled group-data-[disabled=true]/dropzone:active:bg-surface-primary-disabled group-data-[disabled=true]/dropzone:cursor-default',
+        'group-hadata-[disabled=true]/dropzone:bg-surface-primary-disabled group-data-[disabled=true]/dropzone:active:bg-surface-primary-disabled group-data-[disabled=true]/dropzone:cursor-default',
         className
       )}
       children={