diff --git a/.changeset/weak-points-kick.md b/.changeset/weak-points-kick.md
new file mode 100644
index 00000000000..dc64f2b4f84
--- /dev/null
+++ b/.changeset/weak-points-kick.md
@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': minor
+---
+
+Update dropzone container background color when no Outline
diff --git a/polaris-react/src/components/DropZone/DropZone.module.scss b/polaris-react/src/components/DropZone/DropZone.module.scss
index 0eaa0f61a93..9b85b62f12d 100755
--- a/polaris-react/src/components/DropZone/DropZone.module.scss
+++ b/polaris-react/src/components/DropZone/DropZone.module.scss
@@ -59,6 +59,10 @@ $dropzone-stacking-order: (
   &:hover {
     outline: var(--p-border-width-025) solid transparent;
   }
+
+  &.noOutline {
+    background-color: transparent;
+  }
 }
 
 .hasOutline {
diff --git a/polaris-react/src/components/DropZone/DropZone.tsx b/polaris-react/src/components/DropZone/DropZone.tsx
index 14149babae4..d5e8469fed8 100755
--- a/polaris-react/src/components/DropZone/DropZone.tsx
+++ b/polaris-react/src/components/DropZone/DropZone.tsx
@@ -326,6 +326,7 @@ export const DropZone: React.FunctionComponent<DropZoneProps> & {
   const classes = classNames(
     styles.DropZone,
     outline && styles.hasOutline,
+    !outline && styles.noOutline,
     focused && styles.focused,
     (active || dragging) && styles.isDragging,
     disabled && styles.isDisabled,