Recipes

Composite patterns built from Lux components. Copy and adapt.

Auth card

Sign-in form with social buttons, divider, and validation. Common SaaS auth pattern.

Sign in

Welcome back. Enter your details.

or
Don't have an account? Sign up free

Dashboard header

Page title with stat strip and CTA. The starting point for any SaaS dashboard page.

API Usage

Live
  1. Dashboard
  2. API Usage
Total calls
481K
↑ 14%
Avg latency
320ms
↓ 8%
Error rate
0.3%
↓ 0.1%

Settings form

Card-based settings layout with section dividers. Standard pattern for SaaS settings pages.

Model settings

Configure your default inference parameters.

Maximum tokens per response.
Features

Empty state

For when a table or list has no data yet.

No API keys yet

Create your first API key to start making requests. Keys are scoped to environments.

Destructive confirmation

Dialog pattern for irreversible actions. Always use data-variant="danger" on the primary action.

Delete "Project Alpha"?

This will permanently delete the project, all its deployments, and usage history. This action cannot be undone.

This is permanent
All 14 deployments and 3 months of logs will be deleted.

Activity feed

Timeline of events with avatar, timestamp, and badge. Common in dashboards and audit logs.

Recent activity View all
SR
Suryanand deployed v2.4.1 Success
2 minutes ago · Production
MK
MK added API key sk-proj-…x4f2
1 hour ago · Settings
!
Build failed on feat/new-model Error
3 hours ago · CI