Figma · Kite Docs

Bring designs from Figma into Kite as layers you can edit, a few frames or a whole file at a time, and send frames back the other way.

Paste from Figma

In Figma, select the frames or layers and press ⌘C.
In a Kite file, press ⌘V. A pill above the toolbar shows the paste's progress, picture by picture on a large one.

The first time a paste has pictures in it, Kite asks you to connect your Figma account, because a copy from Figma carries its layers but not its pictures (see Connect Figma). Choose Not now and nothing is pasted; copy something without pictures, or connect and paste again.

What comes over

Frames, groups, auto layout, text with its styling, shapes, vectors, fills, strokes and shadows, as Kite layers.
Components you copy, and their instances. An instance copied without its main component comes in as plain layers.
Pictures, fetched with your Figma account.
The variables and styles the layers use, when Figma's copy includes them. They join the file's design system by name, so a colour already there is reused rather than doubled.

A few things don't: masks (what they clipped comes in whole), FigJam stickies and connectors, and some picture adjustments such as temperature and tint. A picture that can't be fetched comes in as a grey placeholder.

Connect Figma

The first paste with pictures opens the Connect Figma dialog, which says what the connection is for. Choose Connect Figma, approve Kite in the Figma window that opens, and the paste carries on. Importing a file by link opens that Figma window straight away.

It reads only the files you can already open in Figma, with your access. It can't change anything there.
Kite uses it for the pictures in what you paste, and for the files you import by link.

To connect ahead of time, or to disconnect, open Settings → Integrations: Figma shows Connect Figma or Disconnect. Pictures you already pasted stay in your files.

Import a whole file

In Figma, copy the file's link (Share → Copy link, or the address bar).
In Kite, open the new tab page. In Kite for Mac, press ⌘T.
Choose Import from Figma, paste the link and choose Import.

Every page of the Figma file comes in as a page of one new Kite file, named after it, with its pictures. It opens when it is ready. A big file can take several minutes: the dialog stays open until then.

Your Figma account can't open that file.: Kite reads it as you, so you need access to it in Figma.
That file is too big to bring in whole: it has more pages than there is time to read. Import a copy with fewer pages, or paste the frames you need.
Kite fetches up to 2,000 pictures an hour from Figma. Past that, or when a big file runs out of time, the rest come as grey placeholders: paste those frames again later to fill them in.

An import brings layers and pictures, not Figma's variables. To turn the file's colours and type into a design system, right-click a frame and choose Make a design system from this frame (see Design systems).

Copy to Figma

Select the frames or layers in Kite.
Right-click and choose Copy/Paste as → Copy to Figma. A large selection takes a few seconds; Kite says Copied — paste it in Figma when it is on the clipboard.
In Figma, press ⌘V.

Frames, auto layout, text, shapes and pictures arrive as layers you can edit in Figma, at the sizes Kite drew them. Components arrive as ordinary frames, and colours from your design system as plain colours. Figma needs the fonts too: one it doesn't have shows there as a missing font.

Other ways out of Kite, as pictures, SVG, PDF or code, are in Export and copy.

Missing fonts

Kite loads any font on Google Fonts by itself. A font that isn't there, or in your workspace, shows in a fallback, and the paste says which. To fix it, click an empty part of the board so nothing is selected; the right panel lists Missing fonts:

Replace fonts… swaps a missing family for another everywhere in the file.
On this computer lists missing fonts you have installed: Add puts one in your workspace. This works in Chrome and other Chromium browsers, and in Kite for Mac.
Upload fonts… takes the font files (TTF, OTF, WOFF or WOFF2).

A font added either way is your workspace's, so everyone who opens the file, and your exports, use it. You can also upload fonts in Settings → General → Fonts. See Workspaces and people.