diff --git a/.github/workflows/chromatic.yaml b/.github/workflows/chromatic.yaml
index af995aa67..3e43f6fde 100644
--- a/.github/workflows/chromatic.yaml
+++ b/.github/workflows/chromatic.yaml
@@ -19,5 +19,3 @@ jobs:
         with:
           projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
           workingDir: packages/react-kit
-          INFURA_PROJECT_SECRET: ${{ secrets.INFURA_PROJECT_SECRET }}
-          REACT_APP_MAGIC_API_KEY: ${{ secrets.REACT_APP_MAGIC_API_KEY }}
diff --git a/packages/react-kit/.storybook/main.ts b/packages/react-kit/.storybook/main.ts
index 8f6f3eb81..967023900 100644
--- a/packages/react-kit/.storybook/main.ts
+++ b/packages/react-kit/.storybook/main.ts
@@ -79,6 +79,11 @@ const config: StorybookConfig = {
     });
     config.plugins = config.plugins?.filter((plugin) => !!plugin);
     return config;
-  }
+  },
+  env: (config) => ({
+    ...config,
+    REACT_APP_MAGIC_API_KEY: process.env.REACT_APP_MAGIC_API_KEY || "REACT_APP_MAGIC_API_KEY_NOT_SET",
+    INFURA_PROJECT_SECRET: process.env.INFURA_PROJECT_SECRET || "INFURA_PROJECT_SECRET_NOT_SET",
+  }),
 };
 export default config;
diff --git a/packages/react-kit/src/lib/config/config.ts b/packages/react-kit/src/lib/config/config.ts
index 870ab7715..aaef2b521 100644
--- a/packages/react-kit/src/lib/config/config.ts
+++ b/packages/react-kit/src/lib/config/config.ts
@@ -1,10 +1,11 @@
 import { getRpcUrls } from "../const/networks";
 
-const magicLinkKey = process.env.REACT_APP_MAGIC_API_KEY;
+const magicLinkKey =
+  process.env.REACT_APP_MAGIC_API_KEY || "REACT_APP_MAGIC_API_KEY";
 if (!magicLinkKey) {
   throw new Error("REACT_APP_MAGIC_API_KEY is not defined");
 }
-const infuraKey = process.env.INFURA_PROJECT_SECRET;
+const infuraKey = process.env.INFURA_PROJECT_SECRET || "INFURA_PROJECT_SECRET";
 if (!infuraKey) {
   throw new Error("INFURA_PROJECT_SECRET is not defined");
 }