diff --git a/src/interface/index.ts b/src/interface/index.ts
index 845f8175..701acf68 100644
--- a/src/interface/index.ts
+++ b/src/interface/index.ts
@@ -3,6 +3,7 @@ import Settings from "./pages/settings.svelte";
 import IconFamily from "@/resources/fonts/IconFamily.woff";
 import browser from "webextension-polyfill";
 import renderSvelte from "./main";
+import { initializeSettingsState } from "@/seqta/utils/listeners/SettingsState";
 
 function InjectCustomIcons() {
   console.info("[BetterSEQTA+] Injecting Icons");
@@ -26,4 +27,5 @@ if (!mountPoint) {
 }
 
 InjectCustomIcons();
+await initializeSettingsState();
 renderSvelte(Settings, mountPoint, { standalone: true });
diff --git a/src/interface/pages/settings.svelte b/src/interface/pages/settings.svelte
index b7bac6d3..6c287234 100644
--- a/src/interface/pages/settings.svelte
+++ b/src/interface/pages/settings.svelte
@@ -7,7 +7,7 @@
 
   import { standalone as StandaloneStore } from '../utils/standalone.svelte';
   import { onMount } from 'svelte'
-  import { initializeSettingsState, settingsState } from '@/seqta/utils/listeners/SettingsState'
+  import { settingsState } from '@/seqta/utils/listeners/SettingsState'
 
   import { closeExtensionPopup } from "@/seqta/utils/Closers/closeExtensionPopup"
   import { OpenAboutPage } from "@/seqta/utils/Openers/OpenAboutPage"
@@ -52,13 +52,12 @@
   let { standalone } = $props<{ standalone?: boolean }>();
   let showColourPicker = $state<boolean>(false);
 
-  onMount(() => {
+  onMount(async () => {
     settingsPopup.addListener(() => {
       showColourPicker = false;
     });
     
     if (!standalone) return;
-    initializeSettingsState();
     StandaloneStore.setStandalone(true);
   });
 </script>