> ## Documentation Index
> Fetch the complete documentation index at: https://docs.buildbetter.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Handoff Export

> Copy as prompt — generate a markdown handoff document with final HTML, screenshot, and iteration log for your engineering team

When a design lands and you want to ship it, the **Copy as prompt** export turns the prototype into a markdown handoff document. Paste it into a PR description, a doc, or an AI coding tool and an engineer can rebuild the design in your production framework.

## What's in the Export

The markdown document contains:

* **Final HTML snapshot** — the prototype's current state with inlined stylesheets, suitable for copy-paste reference
* **Screenshot** — embedded as a data URL so it renders inline in any markdown viewer
* **Full iteration log** — every user prompt and a summary of the agent's actions per turn (modifications, insertions, removals, queries skipped)
* **Implementation notes** — boilerplate reminding the reader that the prototype is a static mockup and must be rebuilt using your production framework's components and design system

## How to Export

<Steps>
  <Step title="Make sure you're on the latest version">
    The **Copy as prompt** option is disabled when viewing an older version — use **Back to latest →** in the Iterations strip first.
  </Step>

  <Step title="Open the Share menu">
    Click the upload icon in the chat sidebar header (top-right).
  </Step>

  <Step title="Click 'Copy as prompt'">
    The markdown document is generated and copied to your clipboard. A toast confirms.
  </Step>

  <Step title="Paste it where it's useful">
    A PR description, a Notion doc, a Linear issue, a chat with your engineer, or directly into an AI coding tool like Cursor or Claude.
  </Step>
</Steps>

## What Engineers Should Know

When handing off, mention these caveats:

* **The HTML is a static mockup.** Don't copy it into production verbatim — rebuild using your component library, design tokens, and accessibility patterns.
* **External images.** The image URLs in the export point to the original captured site's CDN. Replace with assets from your own asset pipeline.
* **No JavaScript.** The prototype demonstrates layout and visual design only. Interactivity, animations, and data fetching are out of scope.
* **The iteration log is the why.** Engineers building from the export can read the chat to understand which decisions were intentional vs. incidental.

## Alternative: Copy Link

If your engineer is in BuildBetter, they don't need the export — they can open the prototype directly. Use **Copy link** in the same Share menu for a quick share that preserves the live editor.

Use the export when the recipient:

* Doesn't have BuildBetter access
* Wants to feed the design into an external AI coding tool
* Needs the design archived in another system (Notion, Linear, GitHub)

## A Note on Iteration History

The export includes the full iteration log — every prompt and agent action. This is intentional. It captures:

* **Intent** — what you asked for at each step
* **Decisions** — what the agent chose to do
* **Direction** — how the design evolved from capture to final state

For complex designs, this context is as valuable to the engineer as the HTML itself.

<Tip>
  If you want a cleaner export focused on the final state without iteration history, copy the HTML directly from your browser's DevTools while viewing the latest version — but you'll lose the "why" that the iteration log provides.
</Tip>