diff --git a/frontend/src/component/providers/PlausibleProvider/PlausibleProvider.tsx b/frontend/src/component/providers/PlausibleProvider/PlausibleProvider.tsx
index 08420407df..3a781d1713 100644
--- a/frontend/src/component/providers/PlausibleProvider/PlausibleProvider.tsx
+++ b/frontend/src/component/providers/PlausibleProvider/PlausibleProvider.tsx
@@ -20,7 +20,7 @@ export const PlausibleProvider: FC = ({ children }) => {
                         'meta[name="uiFlags"]'
                     ) as HTMLMetaElement
                 )?.content || '{}';
-            return JSON.parse(uiFlagsStr);
+            return JSON.parse(decodeURI(uiFlagsStr));
         } catch (e) {
             return {};
         }
diff --git a/src/lib/util/load-index-html.ts b/src/lib/util/load-index-html.ts
index 865162af0e..a163d0b90d 100644
--- a/src/lib/util/load-index-html.ts
+++ b/src/lib/util/load-index-html.ts
@@ -9,7 +9,7 @@ export async function loadIndexHTML(
     publicFolder: string,
 ): Promise<string> {
     const { cdnPrefix, baseUriPath = '' } = config.server;
-    const uiFlags = JSON.stringify(config.ui.flags);
+    const uiFlags = encodeURI(JSON.stringify(config.ui.flags || '{}'));
 
     let indexHTML: string;
     if (cdnPrefix) {