Asset Marking & Generation
Mark layers for export to generate production-ready assets for development handoff.
Developer Handoff
No shortcutIntermediate9 min readQuick Reference
Asset Marking & Generation
FigmaKeyboard Shortcut
N/A
Toolbar Location
Figma toolbar
Best Used For
- ▸Refer to the tutorial content for specific use cases
- ▸Practice with sample projects to build experience
- ▸Combine with other tools for advanced workflows
Intermediate⏱ 30–60 minutes to master
Key Settings
Mark:Settings:Batch:Dev Mode:
Asset Marking & Generation lets you prepare design assets for development. Mark layers for export, set multiple sizes, choose formats, and generate all assets at once.
Where to Find It
Select a layer, scroll to the Export section in the Design panel, and configure export settings.
How to Use
- Mark: Click the + icon in the Export section to add an export setting for the layer.
- Settings: Choose format (PNG, JPG, SVG, PDF) and size multiplier (1x, 2x, 3x).
- Batch: Use the Export button at the top or export all marked assets at once.
- Dev Mode: Developers can see marked assets and download them directly from Dev Mode.
Pro Tips
- Name your layers properly before marking for export — the layer name becomes the file name.
- Export SVG for icons and vector elements, PNG for raster graphics with transparency.