You can share production-ready assets with developers for use in websites or mobile applications. The design assets can be exported from XD to PNG, SVG, JPG, and PDF, optimized for deployment on iOS, Android, or the web.
You can export specific assets or text, specific artboards, or all artboards in the project. If you are using XD on Mac, you can also export assets to other applications. For more information, see Third party integration.
To export design assets on Mac, select File > Export. On Windows, click the Hamburger menu, and click Export.
- Batch: Export assets that are marked using the Mark for Export option.
- Selected: Export selected assets.
- All Artboards: Export all the artboards in your design.
To export multiple objects as a single asset, you must group the objects before you export them.
iOS has three export sizes. Assets are exported at 1x, 2x, and 3x resolutions.
The default artboard sizes for various iOS devices assume that you are designing at 1x, so if you’ve used the defaults, leave your export at 1x. However, you can opt to design at 2x too by doubling the width and height of your artboard.
Use the following infographic to understand how your design assets are exported for iOS when you design at 1x and 2x.
Design assets are optimized and exported for the following Android screen densities:
- ldpi - Low density (75%)
- mdpi - Medium density (100%)
- hdpi - High density (150%)
- xhdpi - Extra high density (200%)
- xxhdpi - Extra extra high density (300%)
- xxxhdpi - Extra extra extra high density (400%)
Use the following infographic to understand how your design assets are exported for Android when you design at different resolutions.
Set styling options, and save them as embedded or linked images.
Styling: You can choose styling as Presentation Attributes or Internal CSS. The default styling for SVG is set to Presentation Attributes as it improves compatibility with common development scenarios, such as exporting SVGs to Android Studio.
Save images: You can save as embedded or linked images.
- Embed: The bitmap image is encoded into the SVG file.
- Link: The bitmap image is stored separately with a reference to the SVG file.
Single PDF file: You can select multiple artboards or assets, and export them as a single PDF file. Multiple artboards or assets are placed in separate pages and a single PDF is created.
Individual PDF files: You can select multiple artboards or assets, and export them as individual PDF files. Separate PDF files are created for each of the selected assets or artboards.
You can bring your designs into other applications that integrate with XD: Zeplin, Avocode, Sympli (only on MAC), Kite Compositor, and Protopie.
The section below provides a high-level overview of the workflow using the example of XD running on Mac with Zeplin.
You can mark layers as assets for export and send them to developers as a design specs link. Developers can download all the vector assets as SVG, PNG, PDF, and bitmap assets as PNG and PDF.
For more information, see Extract assets for design specs.
If you are unable to see third-party applications in the File > Export option, see Unable to see supported third-party app in Export options.
If you are unable to export your file, see Why can't I import or export files in Adobe XD?