All articles

Figma → Tilda Zero Block: the complete workflow without rebuilding

From Frame structure to the published-page check: what to prepare, what to click and where to verify the result.

How the site, plugin and extension connectHow to prepare breakpointsHow to verify an import
01

Three parts of one workflow

The plugin reads selected Figma Frames and builds a local package. The extension works inside Zero Block and turns that package into Tilda elements. The website stores only your account, balance and operation history — layout content is never uploaded to its database.

  • Install the TildEka plugin
  • Install the Chromium extension
  • Authorize the extension through the website
02

Prepare the source

Place 1200, 960, 640, 480 and 320 px versions in one layout or select the desired elements. Give matching elements the same name across widths and avoid duplicates within a screen. This lets the importer sync elements without guessing from coordinates.

  • Screens or elements selected
  • Width matches the breakpoint
  • Fonts are connected in Tilda
03

Build and transfer the package

Select the layout, screens, or arbitrary elements and click “Refresh, sync and copy”. In Zero Block open TILDEKA and choose clipboard import — regular Ctrl+V is not needed.

  • Keep the editor open during import
  • Wait for the completion message
  • Save the Zero Block
04

Verify the result

Open every breakpoint and compare text wrapping, images and positioning. After publishing, verify links and interactions. The operation should appear in your account, and the free balance decreases only after successful completion.

  • Desktop, tablet and mobile
  • Hover and clicks
  • Account history and balance