How to use "Import from Figma" feature to create a board

How to use "Import from Figma" feature to create a board

This article explains how to use Import from Figma to create a board in Visily. You can bring your designs into Visily by copying them directly or by exporting them as a `.vis` file. Once imported, your Figma designs become editable in Visily's board, so you can continue designing, iterating, and collaborating without starting from scratch.

Before you start

Before importing the design to Visily from Figma, make sure you have:
  1. A Visily account with an active paid workspace, as this is a paid feature.
  2. A Figma file with the design you want to import
  3. The Visily plugin is installed in Figma

Export your Figma designs using the Visily plugin

  1. Open your Figma file and launch the Visily plugin.

  2. In the plugin, select Export to Visily.


  3. Select the layers you want to export, such as frames, groups, or components. Your selection will appear in the plugin preview. 


  4. Click Continue to load the layer details. Keep your layers selected until loading is complete, as changing the selection will cancel the current process and update it to the newly selected layers. 


  5. Choose one of the following export methods:
    1. Copy to clipboard: Copy the selected Figma design so you can paste it directly into a Visily board.
    2. Export file: Export the selected Figma design as a ".vis" file to import into Visily.

Create a board in Visily

  1. In your workspace, open a Team Space or Private Space from the left panel.
  2. In the main area, click Import from Figma. You can also click the Create new icon (+) next to the space name to open the board creation menu, then select Import from Figma.
  3. An Import from Figma dialog will open. From there, choose the import method that matches how you exported the design from the Visily plugin:

    1. Import file: Click Import file to upload the exported `.vis` file, or drag and drop the file into the Import file area.
    2. Paste from clipboard: Use this option if you copied the design directly from the Visily plugin instead of exporting a file.
  4. An import dialog will appear and show the exported/copied designs. You can choose to import all layers or only selected ones, then click Import to create a Visily board with those designs added to the board's canvas.

Notes

  1. Visily preserves content and styling as closely as possible during import, but some Figma-specific properties may not fully translate. Unsupported fonts may be replaced, and advanced styles such as multiple color layers, per-corner radius values, or complex multi-layer shadows may be simplified. 
  2. The Visily plugin also supports moving designs in the other direction, from Visily to Figma. 
Need more help?
If this does not solve your issue, contact support and include a screenshot if possible.

    • Related Articles

    • How to create a board

      A board is where your design work happens, and you can create unlimited canvases inside a board for ideation, design, and collaboration. Create Board You can create a board in several ways in Visily: In your workspace view, open either a Team Space ...

    • How to use "Start with AI" to create a board

      This article explains how to use Start with AI to create a board in Visily. With this option, you can brainstorm with AI and generate screens or design elements from a text prompt, with or without images for visual guidance. Create a board using ...

    • How to use "Start with Template" to create a board

      This article explains how to use Start with Template to create a board in Visily. This option lets you start from a prebuilt template from Visily’s template library, including both screen and diagram templates. Start with Template In your workspace, ...

    • How to create a board from scratch

      This article explains how to create a board from scratch in Visily. Create blank board In your workspace, open a Team Space or Private Space from the left panel. In the main area, click Create Blank Board. You can also click the Create new icon (+) ...

    • How to create a Visily account

      This article explains how to create a Visily account and get started with your first workspace. Before you start Make sure you have a valid email address you can access, or a Google/Github account you want to use for sign-up. Steps At the Visily ...