diff --git a/src/app/components/brand-accent/brand-accent.ts b/src/app/components/brand-accent/brand-accent.ts
index 218a54a..ab39854 100644
--- a/src/app/components/brand-accent/brand-accent.ts
+++ b/src/app/components/brand-accent/brand-accent.ts
@@ -97,9 +97,13 @@ export class BrandAccent implements OnDestroy {
 
     this.ctx.globalCompositeOperation = 'multiply';
 
+    const gridGradient = this.ctx.createLinearGradient(0, 0, this.canvasNativeSize[0], this.canvasNativeSize[1]);
+    gridGradient.addColorStop(0, 'rgba(0, 0, 0, 0)');
+    gridGradient.addColorStop(1, 'rgba(0, 0, 0, 0.2)');
+
     this.ctx.beginPath();
     this.ctx.lineWidth = 2;
-    this.ctx.strokeStyle = 'rgba(0, 0, 0, 0.2)';
+    this.ctx.strokeStyle = gridGradient;
     this.ctx.lineCap = 'round';
 
     const lineRenderMargin = this.animation.gridSquareSize * 2;