Designer’s Guide

Videos

Here is a list of the possible options to embed a video into your webpages with figma.to.website.

Youtube & Vimeo

figma.to.website comes with pre-built components for popular video players. You can find them in the “Components” tab of the plugin.
image 16
Drag-and-drop the component from the plugin into the Figma canvas to add the corresponding video player to your pages.

This will create a Figma component with properties already set up so all you need to do is fill out your preferences:
image 17
You can embed any other video player by embedding the HTML of the player. If you need any help, please contact us.

GIF animations

GIF files are natively supported by Figma. Simply drag-and-drop them into your Figma canvas and place them in your webpage.

Keep in mind that GIF videos are very large and limited to 256 colors.
GIF files consume storage space in your figma.to.website plan.

MP4 videos

MP4 files are natively supported on Figma with a Professional plan. Unfortunately, there is currently no way to retrieve video content with the Figma API.

Alternatively, you can use
custom code to embed your MP4 videos by naming the layer using the HTML <video> tag:
<video controls src="https://archive.org/download/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4" width="320">
Demo Inspect in Figma and on the web
This currently requires that you host the MP4 files on another server as we currently don’t offer custom file hosting. Coming soon.
Made
with