Design handoff

Turn a design brief into a handoff package the user pastes into a cloud design tool (Figma Make, Google Stitch, v0, Lovable, …) to build a design system and prototype there. The user runs the tool; this skill prepares its inputs and records its outputs.

Read the brief

Start from docs/design/<slug>-brief.md ([[z-design-brief]]). Missing screens or unresolved actions go back to the brief first — a handoff built on gaps produces a prototype that answers nothing.

Design-system spec

Derive from the brief plus whatever references the user provides — screenshots, products they like, brand assets:

• Tokens — color roles (background, surface, primary, danger, …), type scale, spacing scale, radius. Name roles, not hex values, unless a reference pins them.
• Component inventory — every element the screens' Actions and States imply: buttons, inputs, cards, lists, dialogs, navigation. For each, the variants and states the brief names.
• Voice — density, tone, platform conventions to follow.

Infer from references; where nothing pins a choice, ask — option cases with a recommended default, per [[z-grill-with-docs]] question discipline — don't invent a brand.

Per-screen generation prompts