Import from Figma

How to automatically import a design from Figma into Zero Block
How to get Figma API Access token
Go to the Figma dashboard and click on your profile picture → Settings.
On the Account tab, navigate to the "Personal access tokens" section and enter the name of the token, e.g., "Tilda".
Copy the token value to use it for importing.
Importing layout into Zero Block
Click on the three dots menu on the top right corner inside the Zero Block and choose "Import" out of the drop-down menu.
Go to Figma. Select the Layout you want in the Layers panel and copy its link from the browser address bar.
Paste this link to the Layout URL field and add the API token obtained in the Figma settings to the API Token field.
Wait until the layout is imported.
If you added the correct link and there were no errors from the Figma API side, the layout will be imported into Zero Block.
Note: By default, images are downloaded from Figma servers, that's why to upload them to Tilda, you need to go to the settings of the elements containing images and click the "Upload to Tilda" button.
Layout requirements and import features
Layout
Layouts must be created on a frame with a width of 1200 px.

It is better to import the layout in several blocks, rather than adding the entire layout in one block.
Groups
Any group can be imported as an image. For this, you need to specify "image" in the group name in Figma. If you specify "svg", it will be imported as an SVG file.

Import of groups is available. If there are other groups inside, all elements will be in the first level group.
Shapes and buttons
To import a button, you need to merge the shape and text into a group and name it as "button".

Text alignment property will be imported too, so it is better to make the text the same width as the shape.

If there is an effect on the shape that cannot be reproduced in Zero Block, it is imported with the effect image in the background.
Made on
Tilda