Export a Studio screen as PNG
Save an image of a screen at its viewing dimensions.
Last updated 23 September 2026
Export the screen
Activate the screen in Design, or open it in Prototype.
For a desktop or mobile variant, choose the viewing size in Prototype. Check the displayed dimensions.
Choose Export PNG in the bottom bar.
Wait for pending edits to save, then choose where to save the image.
Check the export status in the bottom bar. If export fails, read the error and retry after resolving it.
What the image includes
The PNG renders the saved screen at one image pixel per CSS pixel. Canvas zoom does not reduce export resolution. Overview thumbnails are separate from the exported image.
An export does not capture temporary JavaScript state from a running prototype, such as a dialog opened only during playback. Save the state as part of the design if it needs to appear in the exported screen.
What export is for
Use PNG for review or sharing a screen image. Use Implement to give a coding agent the design’s structured screens, system, fonts, and assets. Design-system specimens do not expose the screen Export PNG controls.
