diff --git a/packages/client/src/pages/PortalSettings/categories/common/Branding/whitelabel.js b/packages/client/src/pages/PortalSettings/categories/common/Branding/whitelabel.js
index 8820fceb88..aa879b1cfb 100644
--- a/packages/client/src/pages/PortalSettings/categories/common/Branding/whitelabel.js
+++ b/packages/client/src/pages/PortalSettings/categories/common/Branding/whitelabel.js
@@ -54,15 +54,28 @@ const WhiteLabel = (props) => {
   };
 
   const onUseTextAsLogo = () => {
-    let newLogos = [];
+    let newLogos = logoUrlsWhiteLabel;
     for (let i = 0; i < logoUrlsWhiteLabel.length; i++) {
-      const width = logoUrlsWhiteLabel[i].width / 2;
-      const height = logoUrlsWhiteLabel[i].height / 2;
+      const width = logoUrlsWhiteLabel[i].size.width / 2;
+      const height = logoUrlsWhiteLabel[i].size.height / 2;
       const options = getLogoOptions(i, logoTextWhiteLabel);
-      console.log(i, logoUrlsWhiteLabel[i]);
-      const logo = generateLogo(width, height, options.text, options.fontSize);
-      newLogos.push(logo);
+      const logoLight = generateLogo(
+        width,
+        height,
+        options.text,
+        options.fontSize
+      );
+      const logoDark = generateLogo(
+        width,
+        height,
+        options.text,
+        options.fontSize,
+        "#fff"
+      );
+      newLogos[i].path.light = logoLight;
+      newLogos[i].path.dark = logoDark;
     }
+
     setLogoUrlsWhiteLabel(newLogos);
   };
 
diff --git a/packages/client/src/pages/PortalSettings/utils/generateLogo.js b/packages/client/src/pages/PortalSettings/utils/generateLogo.js
index ae7109e653..47529b582d 100644
--- a/packages/client/src/pages/PortalSettings/utils/generateLogo.js
+++ b/packages/client/src/pages/PortalSettings/utils/generateLogo.js
@@ -1,15 +1,22 @@
-export const generateLogo = (width, height, text, fontSize = 18) => {
+export const generateLogo = (
+  width,
+  height,
+  text,
+  fontSize = 18,
+  fontColor = "#000"
+) => {
   const canvas = document.createElement("canvas");
   canvas.width = width;
   canvas.height = height;
   const ctx = canvas.getContext("2d");
   ctx.fillStyle = "transparent";
   ctx.clearRect(0, 0, width, height);
-  ctx.fillStyle = "#000";
+  ctx.fillStyle = fontColor;
   ctx.textAlign = "start";
   ctx.textBaseline = "top";
   ctx.font = `${fontSize}px Arial`;
   ctx.fillText(text, 0, 0);
+
   return canvas.toDataURL();
 };