diff --git a/apps/web/src/app/(app)/components/AppTopbar.tsx b/apps/web/src/app/(app)/components/AppTopbar.tsx
index 058ce92dba..cbbfe0b67b 100644
--- a/apps/web/src/app/(app)/components/AppTopbar.tsx
+++ b/apps/web/src/app/(app)/components/AppTopbar.tsx
@@ -8,6 +8,7 @@ import {
   BreadcrumbList,
   BreadcrumbPage,
 } from '@/components/ui/breadcrumb';
+import { SystemMessageBanner } from '@/components/shared/SystemMessageBanner';
 
 export function AppTopbar() {
   const { title, icon, extras, hideTopbar } = usePageTitle();
@@ -30,6 +31,7 @@ export function AppTopbar() {
               </BreadcrumbItem>
             </BreadcrumbList>
           </Breadcrumb>
+          <SystemMessageBanner />
           {extras && <div className="shrink-0">{extras}</div>}
         </div>
       )}
diff --git a/apps/web/src/components/shared/SystemMessageBanner.tsx b/apps/web/src/components/shared/SystemMessageBanner.tsx
new file mode 100644
index 0000000000..64571c3b48
--- /dev/null
+++ b/apps/web/src/components/shared/SystemMessageBanner.tsx
@@ -0,0 +1,18 @@
+import { Megaphone } from 'lucide-react';
+
+const SYSTEM_MESSAGE_TEXT = 'Important security notice';
+const SYSTEM_MESSAGE_URL = 'https://blog.kilo.ai/';
+
+export function SystemMessageBanner() {
+  return (
+    <a
+      href={SYSTEM_MESSAGE_URL}
+      target="_blank"
+      rel="noopener noreferrer"
+      className="flex min-w-0 shrink-0 items-center gap-1.5 rounded-md bg-primary px-3 py-1 text-xs font-medium text-primary-foreground hover:bg-primary/90"
+    >
+      <Megaphone aria-hidden="true" className="size-3.5 shrink-0" />
+      <span className="truncate underline-offset-2 hover:underline">{SYSTEM_MESSAGE_TEXT}</span>
+    </a>
+  );
+}