Skip to main content

ExportSettings

Figma has four types of image and document export: images, SVGs, PDFs, and REST API JSON. Top-level frames with animated content can additionally be exported as video (MP4, GIF, or WebM).

type ExportSettings =
  | ExportSettingsImage
  | ExportSettingsSVG
  | ExportSettingsPDF
  | ExportSettingsREST

ExportSettings is used for the exportSettings property and the exportAsync function.

Common properties​

contentsOnly?: boolean [readonly]

Whether only the contents of the node are exported, or any overlapping layer in the same area. Defaults to true.

useAbsoluteBounds?: boolean [readonly]

Use the full dimensions of the node regardless of whether or not it is cropped or the space around it is empty. Use this to export text nodes without cropping. Defaults to false.

suffix?: string [readonly]

Suffix appended to the file name when exporting. Defaults to empty string.

colorProfile?: 'DOCUMENT' | 'SRGB' | 'DISPLAY_P3_V4' [readonly]

Color profile of the export.

Defaults to 'DOCUMENT'

  • "DOCUMENT": Use the color profile of documentColorProfile.
  • "SRGB": Use sRGB colors. This was the previous behavior of Figma before color management.
  • "DISPLAY_P3_V4": Use Display P3 colors.

ExportSettingsImage​

format: 'JPG' | 'PNG' [readonly]

The string literal representing the export format. When reading exportSettings, always check the format before reading other properties.

constraint?: ExportSettingsConstraints [readonly]

Constraint on the image size when exporting.

interface ExportSettingsConstraints {
  type: "SCALE" | "WIDTH" | "HEIGHT"
  value: number
}

Defaults to 100% of image size { type: "SCALE", value: 1 }.

  • "SCALE": The size of the exported image is proportional to the size of the exported layer in Figma. A value of 1 means the export is 100% of the layer size.
  • "WIDTH": The exported image is scaled to have a fixed width of value.
  • "HEIGHT": The exported image is scaled to have a fixed height of value.

SVG export​

ExportSettingsSVG controls SVG export settings. The exportAsync function supports an additional ExportSettingsSVGString type for exporting a node to an SVG string. Both types have the below common properties.

Common SVG export properties​

svgOutlineText?: boolean [readonly]

Whether text elements are rendered as outlines (vector paths) or as <text> elements in SVGs. Defaults to true.

Rendering text elements as outlines guarantees that the text looks exactly the same in the SVG as it does in the browser/inside Figma.

Exporting as <text> allows text to be selectable inside SVGs and generally makes the SVG easier to read. However, this relies on the browser’s rendering engine which can vary between browsers and/or operating systems. As such, visual accuracy is not guaranteed as the result could look different than in Figma.

svgIdAttribute?: boolean [readonly]

Whether to include layer names as ID attributes in the SVG. This can be useful as a way to reference particular elements, but increases the size of the SVG. SVG features that require IDs to function, such as masks and gradients, will always have IDs. Defaults to false.

svgSimplifyStroke?: boolean [readonly]

Whether to export inside and outside strokes as an approximation of the original to simplify the output. Otherwise, it uses a more precise but more bloated masking technique. This is needed because SVGs only support center strokes. Defaults to true.

ExportSettingsSVG​

format: 'SVG' [readonly]

The string literal "SVG" representing the export format. When reading exportSettings, always check the format before reading other properties.

ExportSettingsSVGString​

This is used only by exportAsync, and is the same as ExportSettingsSVG above, but exports the node as an "<svg>...</svg>" string rather than a Uint8Array.

format: 'SVG_STRING' [readonly]

The string literal "SVG_STRING" representing the export format.

ExportSettingsPDF​

format: 'PDF' [readonly]

The string literal "PDF" representing the export format. When reading exportSettings, always check the format before reading other properties.

ExportSettingsREST​

This returns a JSON object in the shape of the response of the https://api.figma.com/v1/files endpoint. For more information read about the API here.

format: 'JSON_REST_V1' [readonly]

Returns the equivalent REST API response of hitting the endpoint https://api.figma.com/v1/files/:file_key/nodes?ids=:id.

This is useful if you have existing code that uses the REST API that you would like to have work inside a plugin as well. It can also be significantly more perfomant if you need to serialize large groups of nodes and their children. Here is an example that logs the name of every child in a node using the REST API response:

Using the JSON_REST_V1 format
function visitChildren(child: Object) {
  console.log(child.name);
  if (child.children) {
    child.children.forEach(visitChildren);
  }
}

const response = await figma.currentPage.selection[0].exportAsync({
  format: "JSON_REST_V1",
});

visitChildren(response.document);

For more information on the shape of the output of the 'JSON_REST_V1' format, see the files documentation.

Video export​

A top-level frame whose content is animated can be exported as video via exportAsync, which returns a Uint8Array of the encoded file. The node must be a top-level frame (a frame placed directly on a page); exporting a nested animated frame, an individual keyframed layer, or a non-animated node rejects with an error. These types are used only by exportAsync — they cannot be stored on the exportSettings property, and are only available when running in Figma.

All three video formats share a single size constraint, set via the optional constraint property: a "SCALE" multiplier on the node size, or a fixed "WIDTH" or "HEIGHT" in pixels. See each format's constraint field below for the accepted values. Exports are capped at 3840×2160 (4K) — larger requests are scaled down to fit, preserving aspect ratio.

ExportSettingsMP4​

format: 'MP4' [readonly]

The string literal "MP4" representing the export format.

fps?: 12 | 24 | 30 | 60 [readonly]

Frames per second of the exported video. Defaults to 30.

quality?: 'LOW' | 'MEDIUM' | 'HIGH' [readonly]

Quality preset for the exported video. Higher quality produces a larger file. Defaults to "HIGH".

constraint?: VideoExportConstraint [readonly]

Constraint on the exported video size.

type VideoExportConstraint =
  | { type: "SCALE"; value: 0.5 | 0.75 | 1 | 1.5 | 2 | 3 | 4 }
  | { type: "WIDTH" | "HEIGHT"; value: number }

Defaults to 100% of the node size: { type: "SCALE", value: 1 }.

  • "SCALE": A multiplier on the node size. value must be one of the standard Export panel scales (0.5, 0.75, 1, 1.5, 2, 3, 4). A value of 1 means 100% of the node size.
  • "WIDTH": The exported video is scaled to a fixed pixel width of value.
  • "HEIGHT": The exported video is scaled to a fixed pixel height of value.

ExportSettingsGIF​

format: 'GIF' [readonly]

The string literal "GIF" representing the export format.

fps?: 8 | 12 | 15 | 24 | 30 [readonly]

Frames per second of the exported GIF. Defaults to 15.

loopCount?: number [readonly]

Number of times the GIF loops. 0 loops forever. Must be an integer between 0 and 1000. Defaults to 0.

constraint?: VideoExportConstraint [readonly]

Constraint on the exported GIF size.

type VideoExportConstraint =
  | { type: "SCALE"; value: 0.5 | 0.75 | 1 | 1.5 | 2 | 3 | 4 }
  | { type: "WIDTH" | "HEIGHT"; value: number }

Defaults to 100% of the node size: { type: "SCALE", value: 1 }.

  • "SCALE": A multiplier on the node size. value must be one of the standard Export panel scales (0.5, 0.75, 1, 1.5, 2, 3, 4). A value of 1 means 100% of the node size.
  • "WIDTH": The exported GIF is scaled to a fixed pixel width of value.
  • "HEIGHT": The exported GIF is scaled to a fixed pixel height of value.

ExportSettingsWEBM​

format: 'WEBM' [readonly]

The string literal "WEBM" representing the export format.

fps?: 12 | 24 | 30 | 60 [readonly]

Frames per second of the exported video. Defaults to 30.

quality?: 'LOW' | 'MEDIUM' | 'HIGH' [readonly]

Quality preset for the exported video. Higher quality produces a larger file. Defaults to "HIGH".

constraint?: VideoExportConstraint [readonly]

Constraint on the exported video size.

type VideoExportConstraint =
  | { type: "SCALE"; value: 0.5 | 0.75 | 1 | 1.5 | 2 | 3 | 4 }
  | { type: "WIDTH" | "HEIGHT"; value: number }

Defaults to 100% of the node size: { type: "SCALE", value: 1 }.

  • "SCALE": A multiplier on the node size. value must be one of the standard Export panel scales (0.5, 0.75, 1, 1.5, 2, 3, 4). A value of 1 means 100% of the node size.
  • "WIDTH": The exported video is scaled to a fixed pixel width of value.
  • "HEIGHT": The exported video is scaled to a fixed pixel height of value.