diff --git a/src/app/components/dot-background/dot-background.ts b/src/app/components/dot-background/dot-background.ts
index 3ede884..dc3817e 100644
--- a/src/app/components/dot-background/dot-background.ts
+++ b/src/app/components/dot-background/dot-background.ts
@@ -1,4 +1,4 @@
-import {afterNextRender, AfterViewInit, Component, ElementRef, NgZone, OnDestroy, ViewChild} from '@angular/core';
+import {afterNextRender, Component, ElementRef, NgZone, OnDestroy, ViewChild} from '@angular/core';
 import {Dot} from '../../models/dot';
 
 @Component({
@@ -49,8 +49,17 @@ export class DotBackground implements OnDestroy {
 
   private resize = () => {
     const canvas = this.canvasRef.nativeElement;
-    canvas.width = window.innerWidth;
-    canvas.height = window.innerHeight;
+    const viewport = window.visualViewport;
+
+    if (viewport) {
+      // Modern browsers
+      canvas.width = Math.round(viewport.width * viewport.scale);
+      canvas.height = Math.round(viewport.height * viewport.scale);
+    } else {
+      // Fallback
+      canvas.width = window.innerWidth;
+      canvas.height = window.innerHeight;
+    }
 
     // Clamp dots to new bounds
     for (const dot of this.dots) {