Duet design system

Slate + gold. Light + dark. Built for dual pricing.

Chrome tokens (flip with theme)

bg
surface
surface-2
border
text
text-secondary
accent
accent-soft

Semantic colors (payment / status)

ACH (emerald)
#059669
Card (sky)
#0284C7
Warning (orange)
#F97316
Error (red)
#DC2626

Typography

Display — 3xl semibold

H2 — xl semibold

H3 — base semibold

Body — sm text-secondary leading-6. Use this for most paragraph copy.

Label — xs uppercase tracking-wide

$1,284.00 — tabular-nums for money

Buttons

Status badges

PaidOverdueFailedSentDraftAction needed

Invoice card (merchant view)

Invoice
INV-0001
Paid
Customer
Acme Landscaping
ops@acme.co
Paid via Card
$104.00
App fee $1.14 · 2026-04-13

Customer payment page — the dual pricing moment

Invoice from
AutomateWithUs
ACH / Cash
$100.00
Card
$104.00

Secure payment by Square · Powered by Duet

Table

InvoiceCustomerStatusAmount
INV-0003Sunrise HVACDraft$248.00
INV-0002Harbor PaintingOverdue$1,040.00
INV-0001Acme LandscapingPaid$104.00