Web Design » Figma » How Do I Embed a Figma Prototype in Wix?

How Do I Embed a Figma Prototype in Wix?

Last updated on December 1, 2022 @ 1:22 pm

There are two ways to embed a Figma prototype in Wix. The first is to use the ‘Embed Iframe’ element, and the second is to use the ‘Figma’ element.

Using the ‘Embed Iframe’ element:

To use the ‘Embed Iframe’ element, first add it to your Wix page. Then, click on the element and select ‘Edit code’.
In the code editor that appears, paste the Figma prototype URL into the ‘src’ attribute. For example, if your Figma prototype URL is ‘https://www.figma.com/proto/abc123’, you would paste it into the code editor like this

<iframe src=”https://www.com/proto/abc123″ width=”100%” height=”100%”></iframe>

Save your changes and preview your Wix page to see the embedded Figma prototype.

PRO TIP: If you are planning to embed a Figma prototype in Wix, be aware that there are some potential risks. First, if you are using a free Wix account, your site will include Wix branding. Second, your site may be less responsive than if you were using a paid account. Finally, your site may be subject to Wix’s terms of use, which could limit what you can do with your prototype.

Using the ‘Figma’ element:

To use the ‘Figma’ element, first add it to your Wix page. Then, click on the element and select ‘Edit’. In the window that appears, paste the Figma prototype URL into the ‘URL’ field and click ‘OK’.com/proto/abc123′, you would paste it into the field like this:

https://www.com/proto/abc123

Save your changes and preview your Wix page to see the embedded Figma prototype.

Morgan Bash

Morgan Bash

Technology enthusiast and Co-Founder of Women Coders SF.