Foundations

Lyfta Support design system

Tokens and primitives for help docs and the support workspace. Values live in src/app/globals.css. Usage notes live in docs/design-system.md.

Color

canvas

Page background

surface

Cards and controls

muted

Quiet fills

ink

Headings

brand

Primary actions

accent

Links and focus

success

Resolved / success

warning

Open / attention

danger

Destructive

Type

Kicker

Display heading

Section heading

Large body for help intros and product explanations.

Body copy stays muted so headings and actions carry hierarchy.

ticket_1842 · user@lyfta.app

Components

Buttons — hover, press, and keyboard focus

NeutralPendingOpenResolvedUrgent

Help aside

Use callouts for short warnings or next steps inside an article.

Support row

#4821 · billing restore

Open