diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/access-tokens/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/access-tokens/page.tsx
index 65289b5fa6..9b126c36de 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/access-tokens/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/access-tokens/page.tsx
@@ -20,6 +20,7 @@ import { WORKSPACE_API_TOKENS_LIST } from "@/constants/fetch-keys";
 import { useWorkspace } from "@/hooks/store/use-workspace";
 import { useUserPermissions } from "@/hooks/store/user";
 import type { Route } from "./+types/page";
+import { Button } from "@plane/propel/button";
 
 const workspaceApiTokenService = new WorkspaceAPITokenService();
 
@@ -64,12 +65,10 @@ function ApiTokensPage({ params }: Route.ComponentProps) {
           <SettingsHeading
             title={t("workspace_settings.settings.api_tokens.heading")}
             description={t("workspace_settings.settings.api_tokens.description")}
-            button={{
-              label: t("workspace_settings.settings.api_tokens.add_token"),
-              onClick: () => {
-                setIsCreateTokenModalOpen(true);
-              },
-            }}
+            control={
+          <Button variant="primary" size="lg" onClick={() => setIsCreateTokenModalOpen(true)}>
+              {t("workspace_settings.settings.api_tokens.add_token")}
+            </Button>}
           />
           {tokens.length > 0 ? (
             <div className="flex h-full w-full flex-col">
diff --git a/apps/web/core/components/settings/profile/content/pages/api-tokens.tsx b/apps/web/core/components/settings/profile/content/pages/api-tokens.tsx
index 3205e25b2e..08599d794c 100644
--- a/apps/web/core/components/settings/profile/content/pages/api-tokens.tsx
+++ b/apps/web/core/components/settings/profile/content/pages/api-tokens.tsx
@@ -31,7 +31,7 @@ export const APITokensProfileSettings = observer(function APITokensProfileSettin
   const { t } = useTranslation();
 
   if (!tokens) {
-    return <APITokenSettingsLoader />;
+    return <APITokenSettingsLoader title={t("workspace_settings.settings.api_tokens.title")} />;
   }
 
   return (
diff --git a/apps/web/core/components/settings/workspace/sidebar/item-icon.tsx b/apps/web/core/components/settings/workspace/sidebar/item-icon.tsx
index b89c11fd22..0ac0ad2f83 100644
--- a/apps/web/core/components/settings/workspace/sidebar/item-icon.tsx
+++ b/apps/web/core/components/settings/workspace/sidebar/item-icon.tsx
@@ -5,7 +5,7 @@
  */
 
 import type { LucideIcon } from "lucide-react";
-import { ArrowUpToLine, Building, CreditCard, Users, Webhook } from "lucide-react";
+import { ArrowUpToLine, Building, CreditCard, Users, Webhook, KeyRound } from "lucide-react";
 // plane imports
 import type { ISvgIcons } from "@plane/propel/icons";
 import type { TWorkspaceSettingsTabs } from "@plane/types";
@@ -16,4 +16,5 @@ export const WORKSPACE_SETTINGS_ICONS: Record<TWorkspaceSettingsTabs, LucideIcon
   export: ArrowUpToLine,
   "billing-and-plans": CreditCard,
   webhooks: Webhook,
+  "access-tokens": KeyRound
 };
diff --git a/packages/constants/src/settings/workspace.ts b/packages/constants/src/settings/workspace.ts
index f6b9443695..b0b3a45da1 100644
--- a/packages/constants/src/settings/workspace.ts
+++ b/packages/constants/src/settings/workspace.ts
@@ -56,6 +56,13 @@ export const WORKSPACE_SETTINGS: Record<TWorkspaceSettingsTabs, TWorkspaceSettin
     access: [EUserWorkspaceRoles.ADMIN],
     highlight: (pathname: string, baseUrl: string) => pathname === `${baseUrl}/settings/webhooks/`,
   },
+  "access-tokens": {
+    key: "access-tokens",
+    i18n_label: "workspace_settings.settings.api_tokens.title",
+    href: `/settings/access-tokens`,
+    access: [EUserWorkspaceRoles.ADMIN],
+    highlight: (pathname: string, baseUrl: string) => pathname === `${baseUrl}/settings/access-tokens/`,
+  },
 };
 
 export const WORKSPACE_SETTINGS_ACCESS = Object.fromEntries(
@@ -70,5 +77,5 @@ export const GROUPED_WORKSPACE_SETTINGS: Record<WORKSPACE_SETTINGS_CATEGORY, TWo
     WORKSPACE_SETTINGS["export"],
   ],
   [WORKSPACE_SETTINGS_CATEGORY.FEATURES]: [],
-  [WORKSPACE_SETTINGS_CATEGORY.DEVELOPER]: [WORKSPACE_SETTINGS["webhooks"]],
+  [WORKSPACE_SETTINGS_CATEGORY.DEVELOPER]: [WORKSPACE_SETTINGS["webhooks"],WORKSPACE_SETTINGS["access-tokens"]],
 };
diff --git a/packages/types/src/settings.ts b/packages/types/src/settings.ts
index 7eb994dd56..6e74cf832f 100644
--- a/packages/types/src/settings.ts
+++ b/packages/types/src/settings.ts
@@ -10,7 +10,7 @@ import type { EUserWorkspaceRoles } from "./workspace";
 
 export type TProfileSettingsTabs = "general" | "preferences" | "activity" | "notifications" | "security" | "api-tokens";
 
-export type TWorkspaceSettingsTabs = "general" | "members" | "billing-and-plans" | "export" | "webhooks";
+export type TWorkspaceSettingsTabs = "general" | "members" | "billing-and-plans" | "export" | "webhooks" | "access-tokens";
 export type TWorkspaceSettingsItem = {
   key: TWorkspaceSettingsTabs;
   i18n_label: string;