ReferenceFind the facts

Figma import reference

This page specifies how Figma properties import into Template Builder through the Figma to Storyteq plugin.

General rules

  • A property that Template Builder also supports imports as it is.

  • A property that Template Builder doesn’t support imports as closely as possible, or is converted.

  • An effect that Template Builder doesn’t support is skipped. To keep the effect, flatten the layer in Figma before you publish: the layer then imports as a single image, with its effects included.

Layers

Figma property In Template Builder Set in Figma for the best result

Unsupported effect

Skipped.

Flatten the layer to keep the effect. The layer then imports as a single image.

Page background colour

Not imported.

Set the background colour in Template Builder after import.

More than one fill on a layer

One layer with a single mixed fill, because a Template Builder layer has one fill.

One fill per layer.

Blend mode

Not imported.

Set blend modes in Template Builder after import.

Image and shape layers

Figma property In Template Builder Set in Figma for the best result

Stroke set to Inside or Outside

Stroke set to centre.

Set strokes to Center.

Image fill not set to crop

Imports less accurately.

Set the image to Crop: open the image in edit mode, choose Crop, and adjust its edges.

Shape filled with an image

An image layer and a separate shape layer.

Group the shape.

Grouped shape filled with an image

A vector shape of the image, cut to the shape, with transparency around it.

No change needed.

Text layers

Figma property In Template Builder Set in Figma for the best result

Letter spacing in pixels

Converted to a percentage.

Set letter spacing as a percentage.

Line height in pixels

Converted to a percentage.

Set line height as a percentage.

Line height set to Auto

Template Builder’s default line height.

Set line height as a percentage.