diff --git a/packages/web/components/patterns/DropdownMenu.tsx b/packages/web/components/patterns/DropdownMenu.tsx
index 973047a68..254e5e808 100644
--- a/packages/web/components/patterns/DropdownMenu.tsx
+++ b/packages/web/components/patterns/DropdownMenu.tsx
@@ -19,6 +19,7 @@ export type HeaderDropdownAction =
   | 'navigate-to-labels'
   | 'navigate-to-profile'
   | 'navigate-to-subscriptions'
+  | 'navigate-to-api'
   | 'increaseFontSize'
   | 'decreaseFontSize'
   | 'logout'
@@ -76,6 +77,10 @@ export function DropdownMenu(props: DropdownMenuProps): JSX.Element {
         onSelect={() => props.actionHandler('navigate-to-labels')}
         title="Labels"
       />
+      <DropdownOption
+        onSelect={() => props.actionHandler('navigate-to-api')}
+        title="API Keys"
+      />
       {/* <DropdownOption
         onSelect={() => props.actionHandler('navigate-to-subscriptions')}
         title="Subscriptions"
diff --git a/packages/web/components/patterns/PrimaryHeader.tsx b/packages/web/components/patterns/PrimaryHeader.tsx
index 97bc38c33..cf5139e17 100644
--- a/packages/web/components/patterns/PrimaryHeader.tsx
+++ b/packages/web/components/patterns/PrimaryHeader.tsx
@@ -113,6 +113,9 @@ export function PrimaryHeader(props: HeaderProps): JSX.Element {
       case 'navigate-to-subscriptions':
         router.push('/settings/subscriptions')
         break
+      case 'navigate-to-api':
+        router.push('/settings/api')
+        break
       case 'logout':
         props.setShowLogoutConfirmation(true)
         break