diff --git a/apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx b/apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx
index 7faeb2db786..e40e1f27184 100644
--- a/apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx
+++ b/apps/docs/components/Navigation/NavigationMenu/GlobalMobileMenu.tsx
@@ -1,3 +1,5 @@
+import { getCustomContent } from '~/lib/custom-content/getCustomContent'
+import { useIsLoggedIn, useIsUserLoading } from 'common'
 import { AnimatePresence, domAnimation, LazyMotion, m } from 'framer-motion'
 import { X } from 'lucide-react'
 import Image from 'next/image'
@@ -5,12 +7,9 @@ import Link from 'next/link'
 import { usePathname } from 'next/navigation'
 import { Dispatch, Fragment, SetStateAction, useEffect } from 'react'
 import { useKey } from 'react-use'
-
-import { useIsLoggedIn, useIsUserLoading } from 'common'
 import { Accordion, Button, cn } from 'ui'
 import { ThemeToggle } from 'ui-patterns/ThemeToggle'
 
-import { getCustomContent } from '~/lib/custom-content/getCustomContent'
 import type { DropdownMenuItem } from '../Navigation.types'
 import { MenuItem, useActiveMenuLabel } from './GlobalNavigationMenu'
 import { GLOBAL_MENU_ITEMS } from './NavigationMenu.constants'
@@ -146,7 +145,9 @@ const GlobalMobileMenu = ({ open, setOpen }: Props) => {
                   height={24}
                   alt="Supabase Logo"
                 />
-                <span className="font-mono text-sm font-medium text-brand-link mb-px">DOCS</span>
+                <span className="font-mono text-sm font-medium text-brand-link mb-px ml-2 pl-2 border-l border-default">
+                  DOCS
+                </span>
               </Link>
               <div className="flex gap-4 items-center">
                 <ThemeToggle contentClassName="bg-surface-200" />
diff --git a/apps/docs/components/Navigation/NavigationMenu/TopNavBar.tsx b/apps/docs/components/Navigation/NavigationMenu/TopNavBar.tsx
index ed7537aab81..9f9ff7a0597 100644
--- a/apps/docs/components/Navigation/NavigationMenu/TopNavBar.tsx
+++ b/apps/docs/components/Navigation/NavigationMenu/TopNavBar.tsx
@@ -121,7 +121,9 @@ const HeaderLogo = memo(() => {
         height={navigationLogo?.height ?? 18}
         alt="Supabase wordmark"
       />
-      <span className="font-mono text-sm font-medium text-brand-link mb-px">DOCS</span>
+      <span className="font-mono text-sm font-medium text-brand-link mb-px ml-2 pl-2 border-l border-default">
+        DOCS
+      </span>
     </Link>
   )
 })