diff --git a/.changeset/real-radios-learn.md b/.changeset/real-radios-learn.md
new file mode 100644
index 00000000..a73777dd
--- /dev/null
+++ b/.changeset/real-radios-learn.md
@@ -0,0 +1,5 @@
+---
+"@vue-flow/background": patch
+---
+
+Start patterns at 0,0
diff --git a/packages/background/src/Background.vue b/packages/background/src/Background.vue
index 7dd2375a..dce1a78b 100644
--- a/packages/background/src/Background.vue
+++ b/packages/background/src/Background.vue
@@ -25,19 +25,18 @@ const { id: vueFlowId, viewport } = useVueFlow()
 
 const background = computed(() => {
   const [gapX, gapY] = Array.isArray(gap) ? gap : [gap, gap]
-
   const scaledGap: [number, number] = [gapX * viewport.value.zoom || 1, gapY * viewport.value.zoom || 1]
-
   const scaledSize = size * viewport.value.zoom
+  const [offsetX, offsetY]: [number, number] = Array.isArray(offset) ? offset : [offset, offset]
 
-  const patternOffset =
-    variant === BackgroundVariant.Dots
-      ? [scaledSize / offset, scaledSize / offset]
-      : [scaledGap[0] / offset, scaledGap[1] / offset]
+  const scaledOffset: [number, number] = [
+    offsetX * viewport.value.zoom || 1 + scaledGap[0] / 2,
+    offsetY * viewport.value.zoom || 1 + scaledGap[1] / 2,
+  ]
 
   return {
     scaledGap,
-    offset: patternOffset,
+    offset: scaledOffset,
     size: scaledSize,
   }
 })
@@ -79,7 +78,7 @@ export default {
           </template>
 
           <template v-else-if="variant === BackgroundVariant.Dots">
-            <DotPattern :color="patternColor" :radius="background.size / offset" />
+            <DotPattern :color="patternColor" :radius="background.size / 2" />
           </template>
 
           <svg v-if="bgColor" height="100" width="100">
diff --git a/packages/background/src/types.ts b/packages/background/src/types.ts
index 01f93dcd..637d396a 100644
--- a/packages/background/src/types.ts
+++ b/packages/background/src/types.ts
@@ -38,5 +38,5 @@ export interface BackgroundProps {
   /** Background y-coordinate (offset y) */
   y?: number
   /** Background offset */
-  offset?: number
+  offset?: number | [number, number]
 }