diff --git a/web/app/components/app/in-site-message/__tests__/index.spec.tsx b/web/app/components/app/in-site-message/__tests__/index.spec.tsx
index e4b54e82159..2c13ea9cbf5 100644
--- a/web/app/components/app/in-site-message/__tests__/index.spec.tsx
+++ b/web/app/components/app/in-site-message/__tests__/index.spec.tsx
@@ -42,12 +42,14 @@ describe('InSiteMessage', () => {
     it('should render title, subtitle, markdown content, and action buttons', () => {
       const actions: InSiteMessageActionItem[] = [
         { action: 'close', action_name: 'dismiss', text: 'Close', type: 'default' },
+        { action: 'close', action_name: 'outline', text: 'Outline', type: 'outline' },
         { action: 'link', action_name: 'learn_more', text: 'Learn more', type: 'primary', data: 'https://example.com' },
       ]
 
       renderComponent(actions, { className: 'custom-message' })
 
       const closeButton = screen.getByRole('button', { name: 'Close' })
+      const outlineButton = screen.getByRole('button', { name: 'Outline' })
       const learnMoreButton = screen.getByRole('button', { name: 'Learn more' })
       const panel = closeButton.closest('div.fixed')
       const titleElement = panel?.querySelector('.title-3xl-bold')
@@ -59,6 +61,7 @@ describe('InSiteMessage', () => {
       expect(subtitleElement?.textContent).not.toContain('\\n')
       expect(screen.getByText('Main content')).toBeInTheDocument()
       expect(closeButton).toBeInTheDocument()
+      expect(outlineButton).toHaveClass('bg-components-button-secondary-bg')
       expect(learnMoreButton).toBeInTheDocument()
     })
 
diff --git a/web/app/components/app/in-site-message/__tests__/notification.spec.tsx b/web/app/components/app/in-site-message/__tests__/notification.spec.tsx
index f5171a57c5b..0af00256789 100644
--- a/web/app/components/app/in-site-message/__tests__/notification.spec.tsx
+++ b/web/app/components/app/in-site-message/__tests__/notification.spec.tsx
@@ -116,6 +116,7 @@ describe('InSiteMessageNotification', () => {
               main: 'Parsed body main',
               actions: [
                 { action: 'link', data: 'https://example.com/docs', text: 'Visit docs', type: 'primary' },
+                { action: 'close', text: 'Outline close', type: 'outline' },
                 { action: 'close', text: 'Dismiss now', type: 'default' },
                 { action: 'link', data: 'https://example.com/invalid', text: 100, type: 'primary' },
               ],
@@ -132,6 +133,7 @@ describe('InSiteMessageNotification', () => {
         expect(screen.getByText('Parsed body main')).toBeInTheDocument()
       })
       expect(screen.getByRole('button', { name: 'Visit docs' })).toBeInTheDocument()
+      expect(screen.getByRole('button', { name: 'Outline close' })).toBeInTheDocument()
       expect(screen.getByRole('button', { name: 'Dismiss now' })).toBeInTheDocument()
       expect(screen.queryByRole('button', { name: 'Invalid' })).not.toBeInTheDocument()
 
diff --git a/web/app/components/app/in-site-message/index.tsx b/web/app/components/app/in-site-message/index.tsx
index 4038fb375d9..9452218cf78 100644
--- a/web/app/components/app/in-site-message/index.tsx
+++ b/web/app/components/app/in-site-message/index.tsx
@@ -7,7 +7,7 @@ import { trackEvent } from '@/app/components/base/amplitude'
 import { MarkdownWithDirective } from '@/app/components/base/markdown-with-directive'
 
 type InSiteMessageAction = 'link' | 'close'
-type InSiteMessageButtonType = 'primary' | 'default'
+type InSiteMessageButtonType = 'primary' | 'default' | 'outline'
 
 export type InSiteMessageActionItem = {
   action: InSiteMessageAction
@@ -54,6 +54,14 @@ function normalizeLinkData(data: unknown): { href: string, rel?: string, target?
 
 const DEFAULT_HEADER_BG_URL = '/in-site-message/header-bg.svg'
 
+function resolveButtonVariant(type: InSiteMessageButtonType) {
+  if (type === 'primary')
+    return 'primary'
+  if (type === 'outline')
+    return 'secondary'
+  return 'ghost'
+}
+
 function InSiteMessage({
   notificationId,
   actions,
@@ -132,7 +140,7 @@ function InSiteMessage({
         {actions.map(item => (
           <Button
             key={`${item.type}-${item.action}-${item.text}`}
-            variant={item.type === 'primary' ? 'primary' : 'ghost'}
+            variant={resolveButtonVariant(item.type)}
             size="medium"
             className={cn(item.type === 'default' && 'text-text-secondary')}
             onClick={() => handleAction(item)}
diff --git a/web/app/components/app/in-site-message/notification.tsx b/web/app/components/app/in-site-message/notification.tsx
index cebf6ffd912..97ac168cb5d 100644
--- a/web/app/components/app/in-site-message/notification.tsx
+++ b/web/app/components/app/in-site-message/notification.tsx
@@ -25,7 +25,7 @@ function isValidActionItem(value: unknown): value is InSiteMessageActionItem {
 
   return (
     typeof candidate.text === 'string'
-    && (candidate.type === 'primary' || candidate.type === 'default')
+    && (candidate.type === 'primary' || candidate.type === 'default' || candidate.type === 'outline')
     && (candidate.action === 'link' || candidate.action === 'close')
     && (candidate.data === undefined || typeof candidate.data !== 'function')
   )