diff --git a/epictrack-web/src/components/layout/Header/EnvironmentBanner.tsx b/epictrack-web/src/components/layout/Header/EnvironmentBanner.tsx
index 6ddb3b1f9..9919820de 100644
--- a/epictrack-web/src/components/layout/Header/EnvironmentBanner.tsx
+++ b/epictrack-web/src/components/layout/Header/EnvironmentBanner.tsx
@@ -5,18 +5,16 @@ import { useAppDispatch } from "../../../hooks";
 import { envBanner } from "../../../styles/uiStateSlice";
 import InfoIcon from "../../../assets/images/infoIcon.svg";
 import { ETSubhead } from "../../shared";
-
+import { AppConfig } from "../../../config";
 const EnvironmentBanner = () => {
   const dispatch = useAppDispatch();
-  const host = window.location.hostname;
-  const isTestEnvironment =
-    host.indexOf("dev") !== -1 ||
-    host.indexOf("test") !== -1 ||
-    host.indexOf("demo") !== -1 ||
-    host.indexOf("localhost") !== -1;
+  const env = AppConfig.environment;
+  const isTestEnvironment = ["dev", "test", "demo", "localhost"].includes(env);
+
   React.useEffect(() => {
     dispatch(envBanner(isTestEnvironment));
   }, []);
+
   if (!isTestEnvironment) {
     return (
       <Box
@@ -28,6 +26,7 @@ const EnvironmentBanner = () => {
       ></Box>
     );
   }
+
   return (
     <Box
       sx={{
@@ -44,7 +43,7 @@ const EnvironmentBanner = () => {
       textAlign="center"
     >
       <Box component="img" src={InfoIcon} alt="EPIC.track" />
-      <ETSubhead>You are using a TEST environment</ETSubhead>
+      <ETSubhead>You are using a {env.toUpperCase()} environment</ETSubhead>
     </Box>
   );
 };
diff --git a/epictrack-web/src/config.tsx b/epictrack-web/src/config.tsx
index 269f53431..ad7fab931 100644
--- a/epictrack-web/src/config.tsx
+++ b/epictrack-web/src/config.tsx
@@ -7,6 +7,7 @@ declare global {
       REACT_APP_KEYCLOAK_URL: string;
       REACT_APP_KEYCLOAK_CLIENT: string;
       REACT_APP_KEYCLOAK_REALM: string;
+      REACT_APP_ENV: string;
     };
   }
 }
@@ -22,9 +23,12 @@ const KC_CLIENT =
 const KC_REALM =
   window._env_?.REACT_APP_KEYCLOAK_REALM ||
   process.env.REACT_APP_KEYCLOAK_REALM;
+const APP_ENVIRONMENT =
+  window._env_?.REACT_APP_ENV || process.env.REACT_APP_ENV || "";
 
 export const AppConfig = {
   apiUrl: `${API_URL}/api/v1/`,
+  environment: APP_ENVIRONMENT,
   keycloak: {
     url: KC_URL || "",
     clientId: KC_CLIENT || "",