# Import Figma Design

{% embed url="<https://www.youtube.com/watch?v=F5RYVPibse8>" %}

The Figma to Jet plugin lets you turn your static designs into clean, production-ready Jet components. Add Jet Interactions, wire up content using your data source, and one-click publish your fully functional web apps.

{% @arcade/embed flowId="YjE6uvovuWQ36UpyBO3o" url="<https://app.arcade.software/share/YjE6uvovuWQ36UpyBO3o>" %}

### **Here’s how it works:**

1. **Install + connect.** Pass Figma Plugin key access to the Jet apps you’ll use to transfer designs from Figma to Jet.
2. **Copy + paste.** Design with auto layout in Figma, then easily translate your designs to Jet as responsive components — you can apply pixel-perfect adjustments later.
3. **Polish + publish.** Bring your static designs to Jet, wire content with your data source, and one-click publish your fully functional web apps.

### **Additional features:**

* Auto layout enables responsive across varius devices.
* Your styling, layouts, colors, text, and images will transfer seamlessly when you paste them into Jet.

### What is not supported:

* Masks
* Shapes (import as SVG at the moment)
* Custom border dashes
* Layer/Background blur
* Border join style

### **Workflow tips:**

* Pre-built layout and structure templates are built with auto layout and are fully responsive when pasted into Jet.
* All Vector layers will be exported as SVGs. This can be handy for complex multi-layer graphics.

### **Caveats and future improvements**

* The plugin doesn’t translate prototyping interactions from Figma. Users can apply Jet Interactions after pasting designs over.
* The plugin doesn’t transfer custom fonts. If you’re using custom fonts in Figma, you’ll need to move to Google Fonts before or after importing.

###


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.jetadmin.io/import-figma-design.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.