How to Import

Our Import to Figma feature lets you bring designs from your project into Magic Patterns to make them interactive.
Import from Figma won’t always generate a pixel-perfect frame. That’s because every Magic Patterns design is code-first and interactive, whereas Figma frames are not.
1

Create a new design from the dashboard and click on the 'Import from Figma' button.

2

Connect your Figma account and allow access to your files.

3

Within Figma, copy the link to a desired section or frame in your Figma file.

Select a frame/component in Figma, right click and select ‘Copy as’ and then ‘Copy link to selection’.Select a frame/component in Figma and use “CMD + L” to get the URL.
4

Paste the link into the Magic Patterns import dialog and click 'Next'

5

Ensure the preview is correct and you have chosen your desired preset. Click 'Import' to start the process.