GuideDesign
DesignBeginner6 min

Exporting a design

Take a finished canvas from Myndlab's design surface and get it out as an image, a PDF, or handoff specs — ready to share with stakeholders or your engineering team.

Overview

Myndlab's Design module is a chat-to-design canvas: you describe what you want, and Myndlab draws the screens and refines them with you iteration by iteration. When a canvas is ready, export lets you take it off the canvas in formats your colleagues and developers can use directly.

Export is separate from converting to code. If your goal is a visual share or a handoff for review, export is what you want. If instead you want a real, coded app from your design, see the "Turn a design into a Web App" guide.

Export formats

The export panel offers three formats, each with its own use:

1
Image (PNG)
A high-resolution snapshot of a single screen or the whole canvas. Best for quick shares in team chat, dropping into a slide deck, or attaching to a ticket. Exported at 2× pixel density so it stays crisp on high-DPI displays.
2
Document (PDF)
Each screen on its own page, with the canvas title and export date. Good for stakeholder reviews or formal sign-off — where people prefer scrolling through one document over opening a design tool.
3
Handoff specs
A developer-oriented bundle: dimensions, spacing, colours, fonts, and element copy extracted from each screen. It includes the design tokens (Design DNA) attached to the canvas so what gets built matches the same brand.
💡
Tip.If you're unsure which format to pick, export both a PDF for human review and handoff specs for developers — they serve two different audiences without conflict.

Exporting a canvas

Once a canvas is in a state you're happy with, exporting is a few steps:

1
Open your canvas
In the Design module, open the canvas you want to export. Make sure the latest iteration has finished and the preview is up to date before continuing.
2
Open the export options
Open the export action from the canvas toolbar. A panel appears with the format options and the export scope.
3
Choose format and scope
Pick image, PDF, or handoff specs, then choose whether to export only the selected screen or every screen on the canvas.
4
Export and download
Confirm the export. Myndlab prepares the file and downloads it to your device. The specs format produces a bundle you can share with your team.

What's included

The handoff specs format carries the most information. Here's what you'll find inside:

1
Layout and dimensions
The dimensions of each screen and element, plus padding, margins, and gaps — enough to rebuild the layout faithfully.
2
Style tokens (Design DNA)
The colours, fonts, border radius, and spacing scale attached to the canvas — as design tokens rather than hardcoded values, so the result stays consistent with your brand.
3
Element copy and content
The visible text on each screen (headings, buttons, labels) extracted as copyable text, not as images — so developers don't have to retype it.
4
Screen structure
How the screens relate to one another (such as the flow from one screen to the next where available), giving engineering context about the product intent rather than isolated snapshots.
json
{
  "canvas": "Onboarding flow",
  "screens": 3,
  "tokens": {
    "color-primary": "#7C3AED",
    "color-surface": "#FFFFFF",
    "radius-base": "10px",
    "font-heading": "Inter"
  },
  "exported": "2026-06-06"
}

Handing off to engineering

When handing a design off for your team to build by hand, a few habits make the handoff succeed:

1
Export specs, not just images
Images leave developers guessing at sizes and colours. The specs bundle gives them the actual values and design tokens for a precise match.
2
Attach a PDF for context
Include a PDF alongside the specs so developers see the full intended picture before diving into the values.
3
Consider direct conversion to code
If your end goal is a working app rather than a visual reference, converting the canvas straight into a Web App may be faster than a manual handoff. See the next step below.
Note.Export captures the state of the canvas at the moment you run it. If you keep iterating on the design after exporting, re-export to keep the handed-off bundle in sync with the latest version.

Notes & limits

A few things worth keeping in mind when exporting:

1
Export is a static snapshot
Images and PDFs represent the screens as they look, not as an interactive experience. For real interactivity, convert the design into a Web App.
2
Make sure the iteration is complete
Only export after the preview has settled. Exporting mid-iteration can capture an in-between state.
3
Custom fonts
If the canvas uses a custom font your developers don't have, the specs will name it. Make sure your team has the same font license and source.