diff --git a/src/config/provider.tsx b/src/config/provider.tsx
index d675f0979..d3ccd4806 100644
--- a/src/config/provider.tsx
+++ b/src/config/provider.tsx
@@ -33,23 +33,9 @@ export const ConfigProvider = ({
   );
   const [configVersion, setConfigVersion] = useState(0);
   const { configs } = useConfigStore((s) => ({ configs: s.configs }), shallow);
-  const { setPrimaryColor, setSecondaryColor, setPrimaryShade } = useColorTheme();
 
   const currentConfig = configs.find((c) => c.value.configProperties.name === configName)?.value;
 
-  useEffect(() => {
-    const config = currentConfig ?? fallbackConfig;
-    if (!config) return;
-    setPrimaryColor(config?.settings.customization.colors.primary ?? 'red');
-    setSecondaryColor(config?.settings.customization.colors.secondary ?? 'orange');
-    setPrimaryShade(config?.settings.customization.colors.shade ?? 6);
-    return () => {
-      setPrimaryColor('red');
-      setSecondaryColor('orange');
-      setPrimaryShade(6);
-    };
-  }, [currentConfig]);
-
   return (
     <ConfigContext.Provider
       value={{
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index 76d8bab05..d553b4301 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -66,6 +66,18 @@ function App(
     setPrimaryShade,
   };
 
+  useEffect(() => {
+    console.log('running page props stuff');
+    setPrimaryColor(props.pageProps.primaryColor ?? 'red');
+    setSecondaryColor(props.pageProps.secondaryColor ?? 'orange');
+    setPrimaryShade(props.pageProps.primaryShade ?? 6);
+    return () => {
+      setPrimaryColor('red');
+      setSecondaryColor('orange');
+      setPrimaryShade(6);
+    };
+  }, [props.pageProps]);
+
   const { setInitialPackageAttributes } = usePackageAttributesStore();
 
   useEffect(() => {