Updated: November 16, 2023

Using Figma UI Kits with Other Design Tools

Intro

You can transfer design components from the Figma UI kit to other design tools. This article outlines how to do this for Sketch, Axure RP, and Adobe XD.

Information
You can copy assets between the design tools without a Figma license.

Step 1: Open the UI Kit in Figma

  1. Go to www.figma.com, and sign up for a starter account (free).
  2. Import the UI kit file using the button in the top right corner.
  3. Select the design component you need (see the design components within the layers panel on the left side).

Step 2: Export/Copy to Your Tool

Sketch

  1. Select the design component.
  2. Set up the export:
    1. In design panel on the right, go to the Export section and click the “+” icon.
    2. Choose SVG as the export file.
    3. In the overflow menu (), deselect “Outline Text”.
       If you don’t deselect “Outline Text”, you won’t be able to change text afterwards in your design tool.
  3. Click Export to export the selection.
  4. In Sketch, open the exported SVG file via File / Open Local Document… .

Axure RP

  1. Install the Axure RP Plugin.
  2. Select the design component on the canvas.
  3. Under the main menu on the top left go to Plugins / Axure / Copy Selection for RP.
  4. Open Axure RP and paste the design component to your canvas.

Adobe XD

  1. Right click on the design component and use the Copy as SVG option.
  2. Open Adobe XD and paste the SVG directly to your canvas.

Related Links