diff --git a/web/src/components/ui/button.test.tsx b/web/src/components/ui/button.test.tsx
new file mode 100644
index 0000000..83548af
--- /dev/null
+++ b/web/src/components/ui/button.test.tsx
@@ -0,0 +1,24 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it } from 'vitest'
+
+import { Button } from './button'
+
+describe('Button', () => {
+  it('uses the login gradient for the default primary action', () => {
+    render(<Button>Primary action</Button>)
+
+    expect(screen.getByRole('button', { name: 'Primary action' })).toHaveClass(
+      '[background:var(--silo-gradient)]',
+      'hover:opacity-90',
+    )
+  })
+
+  it('keeps the explicit solid brand variant available', () => {
+    render(<Button variant="brandSolid">Solid action</Button>)
+
+    expect(screen.getByRole('button', { name: 'Solid action' })).toHaveClass(
+      'bg-brand-500',
+      'hover:bg-brand-600',
+    )
+  })
+})
diff --git a/web/src/components/ui/button.tsx b/web/src/components/ui/button.tsx
index 74bf0df..3532f34 100644
--- a/web/src/components/ui/button.tsx
+++ b/web/src/components/ui/button.tsx
@@ -8,7 +8,8 @@ const buttonVariants = cva(
   {
     variants: {
       variant: {
-        default: "bg-brand-500 text-white shadow-theme-xs hover:bg-brand-600",
+        default: "[background:var(--silo-gradient)] text-white shadow-theme-xs hover:opacity-90",
+        brandSolid: "bg-brand-500 text-white shadow-theme-xs hover:bg-brand-600",
         outline:
           "border-gray-300 bg-white text-gray-700 shadow-theme-xs hover:bg-gray-50 hover:text-gray-800 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-200 dark:hover:border-gray-600 dark:hover:bg-gray-700 dark:hover:text-white",
         secondary:
diff --git a/web/src/features/auth/setup-page.tsx b/web/src/features/auth/setup-page.tsx
index 0d92f16..ad4b80d 100644
--- a/web/src/features/auth/setup-page.tsx
+++ b/web/src/features/auth/setup-page.tsx
@@ -130,7 +130,7 @@ export function SetupPage() {
             </label>
           </div>
           {error ? <p className="setup-error">{error}</p> : null}
-          <Button className="w-full" type="submit" disabled={pending}>
+          <Button className="w-full" variant="brandSolid" type="submit" disabled={pending}>
             <Icon name={pending ? 'loader' : 'arrowRight'} className={pending ? 'animate-spin' : ''} />
             {pending ? t('common.working') : t('setup.finish')}
           </Button>