Export images and PDF

Save any layer as PNG, JPG, WebP, SVG or PDF from the Export section of the Inspector.

Export a layer

1. 1Select a layer on the canvas or in Layers. A whole screen is usually a top-level frame.
2. 2In the Inspector, in Design mode, find the Export section near the bottom.
3. 3Click + (Add export) to add a row. The first row is PNG at 1x.
4. 4Pick the scale and format for each row.
5. 5Click Export followed by the layer name.

Potlot saves one file per row. In the desktop app each file goes through a Save dialog; cancel a dialog to skip that file.

Formats and scales

Each click of + adds the next scale up of the last raster row, so PNG 1x, then 2x, then 3x. You can add several rows to export, for example, a PNG at 1x and 2x and a PDF in one go.

File names follow the layer name, with a scale suffix for raster formats other than 1x: Card.png, Card@2x.png, Card.svg.

What you get

• PNG, JPG, WebP and PDF are rendered with headless Chrome, the same engine Potlot uses to measure and lay out text, so they match the canvas.
• SVG is written directly from the layer, with images embedded in the file.
• Exporting does not change the document.

If an export finishes with warnings, for example an image that could not be embedded, Potlot shows the count and the first warning in a notification.

Limits

• One layer per export. To export a whole screen, select its frame.
• Hidden layers, and layers inside a hidden layer, cannot be exported. Show them first.
• Notes, prompts, context, connection and script layers are not drawn as artwork and cannot be exported.
• A raster export is capped at about 33 million pixels, measured from the layer's bounding box after rotation. If you hit the limit, lower the scale.

Ask an agent to export

Agents can export too. Ask for something like "export the hero frame as PNG at 2x into the project folder". The agent uses the same formats through its Export function, and it can take screenshots of frames to check its own work.

For code instead of images, see Export HTML.

Something unclear, missing or broken? Write to feedback@anaknegeri.dev.