diff --git a/ui/litellm-dashboard/src/components/navbar.test.tsx b/ui/litellm-dashboard/src/components/navbar.test.tsx
index 9d80a89f83e..4ea2f665fbd 100644
--- a/ui/litellm-dashboard/src/components/navbar.test.tsx
+++ b/ui/litellm-dashboard/src/components/navbar.test.tsx
@@ -269,6 +269,13 @@ describe("Navbar", () => {
     expect(screen.queryByRole("button", { name: /^notifications$/i })).not.toBeInTheDocument();
   });
 
+  it("should keep the theme toggle on public pages", () => {
+    const publicPageProps = { ...defaultProps, isPublicPage: true };
+    renderWithProviders(<Navbar {...publicPageProps} />);
+
+    expect(screen.getByRole("button", { name: /^theme$/i })).toBeInTheDocument();
+  });
+
   it("should handle hide new feature indicators toggle", async () => {
     const user = userEvent.setup();
 
diff --git a/ui/litellm-dashboard/src/components/navbar.tsx b/ui/litellm-dashboard/src/components/navbar.tsx
index 8bc9b06969e..7c823301a87 100644
--- a/ui/litellm-dashboard/src/components/navbar.tsx
+++ b/ui/litellm-dashboard/src/components/navbar.tsx
@@ -123,7 +123,7 @@ const Navbar: React.FC<NavbarProps> = ({
             </div>
           )}
 
-          <div className="ml-auto flex min-w-0 flex-1 items-center justify-end gap-4">
+          <div className="ml-auto flex min-w-0 flex-1 items-center justify-end gap-4 max-sm:gap-2">
             {showWorkerSwitch && (
               <div className="flex shrink-0 items-center">
                 <WorkerDropdown onWorkerSwitch={handleWorkerSwitch} />
@@ -144,17 +144,19 @@ const Navbar: React.FC<NavbarProps> = ({
               </div>
             )}
 
-            {!isPublicPage && (
-              <div className="flex shrink-0 items-center border-l border-border pl-4">
-                <div className="flex items-center gap-0.5 rounded-lg bg-muted px-1 py-0 transition-colors hover:bg-accent">
-                  <ThemeToggle />
-                  <span className="mx-0.5 h-6 w-px shrink-0 bg-border" aria-hidden />
-                  <NotificationsBell />
-                  <span className="mx-0.5 h-6 w-px shrink-0 bg-border" aria-hidden />
-                  <UserDropdown onLogout={handleLogout} />
-                </div>
+            <div className="flex shrink-0 items-center border-l border-border pl-4 max-sm:border-l-0 max-sm:pl-2">
+              <div className="flex items-center gap-0.5 rounded-lg bg-muted px-1 py-0 transition-colors hover:bg-accent">
+                <ThemeToggle />
+                {!isPublicPage && (
+                  <>
+                    <span className="mx-0.5 h-6 w-px shrink-0 bg-border" aria-hidden />
+                    <NotificationsBell />
+                    <span className="mx-0.5 h-6 w-px shrink-0 bg-border" aria-hidden />
+                    <UserDropdown onLogout={handleLogout} />
+                  </>
+                )}
               </div>
-            )}
+            </div>
           </div>
         </div>
       </div>