diff --git a/frontend/src/component/admin/apiToken/ApiTokenForm/EnvironmentSelector/EnvironmentSelector.tsx b/frontend/src/component/admin/apiToken/ApiTokenForm/EnvironmentSelector/EnvironmentSelector.tsx
index 894dcec623..7447f4e005 100644
--- a/frontend/src/component/admin/apiToken/ApiTokenForm/EnvironmentSelector/EnvironmentSelector.tsx
+++ b/frontend/src/component/admin/apiToken/ApiTokenForm/EnvironmentSelector/EnvironmentSelector.tsx
@@ -5,19 +5,28 @@ import {
     StyledInputDescription,
     StyledSelectInput,
 } from '../ApiTokenForm.styles';
-import { useEnvironments } from '../../../../../hooks/api/getters/useEnvironments/useEnvironments';
+import {
+    IEnvironment,
+    IProjectEnvironment,
+} from '../../../../../interfaces/environments';
 
 interface IEnvironmentSelectorProps {
     type: string;
     environment?: string;
+    environments: IProjectEnvironment[] | IEnvironment[];
     setEnvironment: React.Dispatch<React.SetStateAction<string | undefined>>;
 }
 export const EnvironmentSelector = ({
     type,
     environment,
     setEnvironment,
+    environments,
 }: IEnvironmentSelectorProps) => {
-    const { environments } = useEnvironments();
+    const isProjectEnv = (
+        environment: IEnvironment | IProjectEnvironment
+    ): environment is IProjectEnvironment => {
+        return 'projectVisible' in environment;
+    };
     const selectableEnvs =
         type === TokenType.ADMIN
             ? [{ key: '*', label: 'ALL' }]
@@ -25,7 +34,9 @@ export const EnvironmentSelector = ({
                   key: environment.name,
                   label: environment.name,
                   title: environment.name,
-                  disabled: !environment.enabled,
+                  disabled: isProjectEnv(environment)
+                      ? !environment.projectVisible
+                      : !environment.enabled,
               }));
 
     return (
diff --git a/frontend/src/component/admin/apiToken/CreateApiToken/CreateApiToken.tsx b/frontend/src/component/admin/apiToken/CreateApiToken/CreateApiToken.tsx
index e4f13fd8d4..a31e5ff07f 100644
--- a/frontend/src/component/admin/apiToken/CreateApiToken/CreateApiToken.tsx
+++ b/frontend/src/component/admin/apiToken/CreateApiToken/CreateApiToken.tsx
@@ -18,6 +18,7 @@ import { TokenInfo } from '../ApiTokenForm/TokenInfo/TokenInfo';
 import { TokenTypeSelector } from '../ApiTokenForm/TokenTypeSelector/TokenTypeSelector';
 import { ProjectSelector } from '../ApiTokenForm/ProjectSelector/ProjectSelector';
 import { EnvironmentSelector } from '../ApiTokenForm/EnvironmentSelector/EnvironmentSelector';
+import { useEnvironments } from '../../../../hooks/api/getters/useEnvironments/useEnvironments';
 
 const pageTitle = 'Create API token';
 interface ICreateApiTokenProps {
@@ -29,6 +30,7 @@ export const CreateApiToken = ({ modal = false }: ICreateApiTokenProps) => {
     const navigate = useNavigate();
     const [showConfirm, setShowConfirm] = useState(false);
     const [token, setToken] = useState('');
+    const { environments } = useEnvironments();
 
     const {
         getApiTokenPayload,
@@ -125,6 +127,7 @@ export const CreateApiToken = ({ modal = false }: ICreateApiTokenProps) => {
                 />
                 <EnvironmentSelector
                     type={type}
+                    environments={environments}
                     environment={environment}
                     setEnvironment={setEnvironment}
                 />
diff --git a/frontend/src/component/project/Project/ProjectSettings/ProjectApiAccess/CreateProjectApiTokenForm.tsx b/frontend/src/component/project/Project/ProjectSettings/ProjectApiAccess/CreateProjectApiTokenForm.tsx
index f40a9e3c55..8c26b792f3 100644
--- a/frontend/src/component/project/Project/ProjectSettings/ProjectApiAccess/CreateProjectApiTokenForm.tsx
+++ b/frontend/src/component/project/Project/ProjectSettings/ProjectApiAccess/CreateProjectApiTokenForm.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useMemo, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import FormTemplate from 'component/common/FormTemplate/FormTemplate';
 
@@ -21,11 +21,14 @@ import { TokenTypeSelector } from 'component/admin/apiToken/ApiTokenForm/TokenTy
 import { ConfirmToken } from 'component/admin/apiToken/ConfirmToken/ConfirmToken';
 import { useProjectApiTokens } from 'hooks/api/getters/useProjectApiTokens/useProjectApiTokens';
 import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
+import { useProjectEnvironments } from '../../../../../hooks/api/getters/useProjectEnvironments/useProjectEnvironments';
+import { IProjectEnvironment } from '../../../../../interfaces/environments';
+import useProject from '../../../../../hooks/api/getters/useProject/useProject';
 
 const pageTitle = 'Create project API token';
 
 export const CreateProjectApiTokenForm = () => {
-    const project = useRequiredPathParam('projectId');
+    const projectId = useRequiredPathParam('projectId');
     const { setToastApiError } = useToast();
     const { uiConfig } = useUiConfig();
     const navigate = useNavigate();
@@ -43,16 +46,28 @@ export const CreateProjectApiTokenForm = () => {
         isValid,
         errors,
         clearErrors,
-    } = useApiTokenForm(project);
+    } = useApiTokenForm(projectId);
 
     const { createToken: createProjectToken, loading } =
         useProjectApiTokensApi();
-    const { refetch: refetchProjectTokens } = useProjectApiTokens(project);
+    const { refetch: refetchProjectTokens } = useProjectApiTokens(projectId);
     const { trackEvent } = usePlausibleTracker();
+    const { environments } = useProjectEnvironments(projectId);
+    const { project } = useProject(projectId);
 
+    const projectEnvironments = useMemo<IProjectEnvironment[]>(
+        () =>
+            environments.map(environment => ({
+                ...environment,
+                projectVisible: project?.environments.includes(
+                    environment.name
+                ),
+            })),
+        [environments, project?.environments]
+    );
     usePageTitle(pageTitle);
 
-    const PATH = `api/admin/project/${project}/api-tokens`;
+    const PATH = `api/admin/project/${projectId}/api-tokens`;
     const permission = CREATE_PROJECT_API_TOKEN;
 
     const handleSubmit = async (e: Event) => {
@@ -63,7 +78,7 @@ export const CreateProjectApiTokenForm = () => {
         try {
             const payload = getApiTokenPayload();
 
-            await createProjectToken(payload, project)
+            await createProjectToken(payload, projectId)
                 .then(res => res.json())
                 .then(api => {
                     scrollToTop();
@@ -116,7 +131,7 @@ export const CreateProjectApiTokenForm = () => {
                     <CreateButton
                         name="token"
                         permission={permission}
-                        projectId={project}
+                        projectId={projectId}
                     />
                 }
             >
@@ -131,6 +146,7 @@ export const CreateProjectApiTokenForm = () => {
                     type={type}
                     environment={environment}
                     setEnvironment={setEnvironment}
+                    environments={projectEnvironments}
                 />
             </ApiTokenForm>
             <ConfirmToken