Importing from Figma

With the Figma plugin installed, you can easily copy over layers from Figma to Framer. All you need to do is copy the layers you want to bring over in Figma and paste them on the Framer canvas.

How to paste

1. Install the Framer Copy Paste plugin

2. Select what you want to copy in Figma

3. Run the plugin, open the Figma menu, go to plugins, click Framer Copy Paste

4. In Framer, open a new or existing Framer project

5. In Framer, paste on the canvas

You can run the last plugin again with ⌥⌘P. If you use the Figma app, you will not see the plugin window, so it will be even faster.

Replacing Fonts

Unfortunately Framer cannot import fonts from Figma, so any non standard font will be replaced with a default. You can easily batch replace these with a Google or custom font:

How to replace missing fonts

How to add a custom font

Support

An overview of Figma features that Framer does not support:

• Corner smoothing

• Image strokes

Paragraph indent

Text number features

OpenType features

• Interactive features

Components and Libraries

We often get asked why we don't extend our importer to convert whole libraries. While it seems an appealing idea, we decided against it for two reasons:

• Components created for a static canvas just work different than components you need to ship to a production site. The expectation would be to just "make that work" and that would be impossible.

• The component options from Figma don't really overlap enough with how Framer works so we could get things for 80% right (if we spend a ton of time in it), which doesn't really meet the usefulness bar.

That said, our importer is really good and should give you a pretty great starting point when porting over your library to production components.

Importing from Figma

With the Figma plugin installed, you can easily copy over layers from Figma to Framer. All you need to do is copy the layers you want to bring over in Figma and paste them on the Framer canvas.

How to paste

1. Install the Framer Copy Paste plugin

2. Select what you want to copy in Figma

3. Run the plugin, open the Figma menu, go to plugins, click Framer Copy Paste

4. In Framer, open a new or existing Framer project

5. In Framer, paste on the canvas

You can run the last plugin again with ⌥⌘P. If you use the Figma app, you will not see the plugin window, so it will be even faster.

Replacing Fonts

Unfortunately Framer cannot import fonts from Figma, so any non standard font will be replaced with a default. You can easily batch replace these with a Google or custom font:

How to replace missing fonts

How to add a custom font

Support

An overview of Figma features that Framer does not support:

• Corner smoothing

• Image strokes

Paragraph indent

Text number features

OpenType features

• Interactive features

Components and Libraries

We often get asked why we don't extend our importer to convert whole libraries. While it seems an appealing idea, we decided against it for two reasons:

• Components created for a static canvas just work different than components you need to ship to a production site. The expectation would be to just "make that work" and that would be impossible.

• The component options from Figma don't really overlap enough with how Framer works so we could get things for 80% right (if we spend a ton of time in it), which doesn't really meet the usefulness bar.

That said, our importer is really good and should give you a pretty great starting point when porting over your library to production components.

Importing from Figma

With the Figma plugin installed, you can easily copy over layers from Figma to Framer. All you need to do is copy the layers you want to bring over in Figma and paste them on the Framer canvas.

How to paste

1. Install the Framer Copy Paste plugin

2. Select what you want to copy in Figma

3. Run the plugin, open the Figma menu, go to plugins, click Framer Copy Paste

4. In Framer, open a new or existing Framer project

5. In Framer, paste on the canvas

You can run the last plugin again with ⌥⌘P. If you use the Figma app, you will not see the plugin window, so it will be even faster.

Replacing Fonts

Unfortunately Framer cannot import fonts from Figma, so any non standard font will be replaced with a default. You can easily batch replace these with a Google or custom font:

How to replace missing fonts

How to add a custom font

Support

An overview of Figma features that Framer does not support:

• Corner smoothing

• Image strokes

Paragraph indent

Text number features

OpenType features

• Interactive features

Components and Libraries

We often get asked why we don't extend our importer to convert whole libraries. While it seems an appealing idea, we decided against it for two reasons:

• Components created for a static canvas just work different than components you need to ship to a production site. The expectation would be to just "make that work" and that would be impossible.

• The component options from Figma don't really overlap enough with how Framer works so we could get things for 80% right (if we spend a ton of time in it), which doesn't really meet the usefulness bar.

That said, our importer is really good and should give you a pretty great starting point when porting over your library to production components.