> For the complete documentation index, see [llms.txt](https://docs.blup.in/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.blup.in/~/changes/bxpytJQPpsJWb4ZdG6qm/import-from-figma.md).

# Import from Figma

There are some steps to bring your Figma file inside Blup.

### **Step 1: Copy the File ID from the URL**

When you open up your Figma file in a browser, you must copy the text after '.../file/' and before the next '/...'. from the file URL.

<figure><img src="/files/FlbJSs9NFW9tgIn6BZZl" alt="copy file id from figma file url"><figcaption><p>Copy File FiD</p></figcaption></figure>

### Step 2: Paste the File ID

Paste the file-id you got from the first step and paste it in the File ID of **Import from Figma** dialog box.

<figure><img src="/files/b7egT8eH3oVOprCmT8Ir" alt="paste file-id"><figcaption><p>Paste the file-id</p></figcaption></figure>

### Step 3: Create a Token from Figma

<figure><img src="/files/LygZkzqGPMQVpELNeabC" alt="create token from figma"><figcaption><p>Create token from figma</p></figcaption></figure>

### Step 4 Paste the copied token

Paste the copied token you got from the third step and paste it in the File ID of **Import from Figma** dialog box

<figure><img src="/files/wFIbLQIUGmZyG6fofzLJ" alt="paste the copied token"><figcaption><p>paste the copied token</p></figcaption></figure>

### Step 5: Wait & let the magic happen!

1. Click on **Import design's** Button
2. Select the frames you want to import and click on **Import**
3. And the magic happens.

<figure><img src="/files/UAqlymL93wthSV3BsrLB" alt=""><figcaption><p>import design</p></figcaption></figure>