diff --git a/ui/litellm-dashboard/src/components/leftnav.test.tsx b/ui/litellm-dashboard/src/components/leftnav.test.tsx
index 2692ad5c953..2c8fe52f97f 100644
--- a/ui/litellm-dashboard/src/components/leftnav.test.tsx
+++ b/ui/litellm-dashboard/src/components/leftnav.test.tsx
@@ -237,6 +237,24 @@ describe("Sidebar (leftnav)", () => {
     expect(link!.querySelector("svg")).not.toBeNull();
     expect(label).toHaveClass("group-data-[collapsed=true]/sidebar:hidden");
   });
+
+  it("shows Cost Optimization with a Beta badge and no feature-flag gate", () => {
+    const { container } = renderWithProviders(<Sidebar {...defaultProps} enableProjectsUI={false} />);
+
+    const costOptimization = container.querySelector('a[href*="cost-optimization"]');
+    expect(costOptimization).not.toBeNull();
+    expect(costOptimization!.textContent).toContain("Cost Optimization");
+    expect(costOptimization!.textContent).toContain("Beta");
+
+    expect(container.querySelector('a[href*="projects"]')).toBeNull();
+  });
+
+  it("keeps a readable collapsed-rail tooltip for items whose label carries a badge", () => {
+    const { container } = renderWithProviders(<Sidebar {...defaultProps} enableProjectsUI collapsed />);
+
+    expect(container.querySelector('a[href*="cost-optimization"]')).toHaveAttribute("title", "Cost Optimization");
+    expect(container.querySelector('a[href*="projects"]')).toHaveAttribute("title", "Projects");
+  });
 });
 
 describe("getBreadcrumb", () => {
diff --git a/ui/litellm-dashboard/src/components/leftnav.tsx b/ui/litellm-dashboard/src/components/leftnav.tsx
index 355db8bdfc7..4aa15f5fc28 100644
--- a/ui/litellm-dashboard/src/components/leftnav.tsx
+++ b/ui/litellm-dashboard/src/components/leftnav.tsx
@@ -187,7 +187,11 @@ const menuGroups: MenuGroup[] = [
         page: "cost-optimization",
         icon: <PiggyBank {...ICON} />,
         roles: [...all_admin_roles, ...internalUserRoles],
-        label: "Cost Optimization",
+        label: (
+          <span className="flex items-center gap-2">
+            Cost Optimization <BetaBadge />
+          </span>
+        ),
       },
       { key: "logs", page: "logs", label: "Logs", icon: <Activity {...ICON} /> },
       {
@@ -354,8 +358,6 @@ const findMenuItemKey = (page: string): string => {
   return "api-keys";
 };
 
-const labelText = (item: MenuItem): string => (typeof item.label === "string" ? item.label : item.key);
-
 const SECTION_DISPLAY: Record<string, string> = {
   "AI GATEWAY": "AI Gateway",
   OBSERVABILITY: "Observability",
@@ -370,6 +372,8 @@ const prettify = (key: string): string =>
     .map((w) => w.charAt(0).toUpperCase() + w.slice(1))
     .join(" ");
 
+const labelText = (item: MenuItem): string => (typeof item.label === "string" ? item.label : prettify(item.key));
+
 // Breadcrumb ("Section" / "Page") for the top bar, derived from the same nav config.
 export const getBreadcrumb = (page: string): { section: string | null; title: string } => {
   for (const group of menuGroups) {