diff --git a/src/components/account-info.jsx b/src/components/account-info.jsx
index 79a5e570e..24d3c39a2 100644
--- a/src/components/account-info.jsx
+++ b/src/components/account-info.jsx
@@ -188,7 +188,9 @@ function AccountInfo({
                   try {
                     // Get color from four corners of image
                     const canvas = document.createElement('canvas');
-                    const ctx = canvas.getContext('2d');
+                    const ctx = canvas.getContext('2d', {
+                      willReadFrequently: true,
+                    });
                     canvas.width = e.target.width;
                     canvas.height = e.target.height;
                     ctx.drawImage(e.target, 0, 0);
diff --git a/src/components/avatar.jsx b/src/components/avatar.jsx
index 3c30d4bc2..48412a541 100644
--- a/src/components/avatar.jsx
+++ b/src/components/avatar.jsx
@@ -16,7 +16,9 @@ const alphaCache = {};
 const canvas = window.OffscreenCanvas
   ? new OffscreenCanvas(1, 1)
   : document.createElement('canvas');
-const ctx = canvas.getContext('2d');
+const ctx = canvas.getContext('2d', {
+  willReadFrequently: true,
+});
 
 function Avatar({ url, size, alt = '', squircle, ...props }) {
   size = SIZES[size] || size || SIZES.m;