
Renaming exported images in Figma or Sketch involves setting custom filenames before generating asset files. Unlike simple saving, this process happens within the export dialogue using specific naming syntax and variables. Both platforms allow users to define templates incorporating elements like layer names, dimensions, scales, and custom text, automating consistent naming across multiple assets without manual post-export renaming.

In Figma, select layers, open the export panel (right sidebar), click the settings icon next to the format, and enter a name using variables like {layer_name}
, {scale}
, or {width}x{height}
(e.g., icon-{layer_name}-{width}.png
). Sketch offers similar functionality: in the export preview sidebar, click the export preset dropdown, choose "Rename Layers", and define patterns using variables such as %layer
, %scale
, or %prefix
for contextual filenames.
This templated approach ensures naming consistency across teams (e.g., mobile UI teams) and simplifies asset management for developers. However, complex naming rules can be cumbersome to define, and multi-select exports might not always merge variable contexts perfectly. Adoption relies on understanding the platform-specific syntax, but significantly enhances workflow efficiency compared to manually altering filenames post-export.
How do I rename exported images from Figma or Sketch?
Renaming exported images in Figma or Sketch involves setting custom filenames before generating asset files. Unlike simple saving, this process happens within the export dialogue using specific naming syntax and variables. Both platforms allow users to define templates incorporating elements like layer names, dimensions, scales, and custom text, automating consistent naming across multiple assets without manual post-export renaming.

In Figma, select layers, open the export panel (right sidebar), click the settings icon next to the format, and enter a name using variables like {layer_name}
, {scale}
, or {width}x{height}
(e.g., icon-{layer_name}-{width}.png
). Sketch offers similar functionality: in the export preview sidebar, click the export preset dropdown, choose "Rename Layers", and define patterns using variables such as %layer
, %scale
, or %prefix
for contextual filenames.
This templated approach ensures naming consistency across teams (e.g., mobile UI teams) and simplifies asset management for developers. However, complex naming rules can be cumbersome to define, and multi-select exports might not always merge variable contexts perfectly. Adoption relies on understanding the platform-specific syntax, but significantly enhances workflow efficiency compared to manually altering filenames post-export.
Quick Article Links
Why does my scanner use .tif instead of .jpg?
Scanners often produce .tif files instead of .jpg because TIFF is a lossless format designed for archival quality. Unlik...
Can I rename email attachments after saving them?
Renaming email attachments after saving them is simply changing the filename stored on your computer. This involves loca...
Why does my file crash the app when opening?
Files crash apps when opening due to a mismatch between the app's expectations and the file's data. Common causes includ...