Figma Video: It's a Fill, Not a Layer

WHY IT EXISTS Static prototypes can't fully replicate apps with video content. Figma added video fills to allow designers to create higher-fidelity, more realistic user experiences without leaving the design tool, bridging the gap between static mockups and a live product.

THE MENTAL MODEL Think of a video in Figma as "moving paint" you can pour into any shape. It's not a distinct video layer like in a video editor; it's a fill property, just like a solid color, gradient, or image. This means any object that can have a fill can have a video playing inside it.

HOW IT WORKS Figma treats video files (.mp4, .mov, .webm up to 300MB) as a fill type. You can add a video by dragging it onto the canvas, using the "Place image/video" tool, or selecting it from the Fill panel for any shape. Once applied, you can scale, rotate, and crop the object, and the video fill will conform. You then use prototype interactions to trigger playback, such as setting a video to autoplay or play on click.

WHEN TO USE IT Use video fills for high-fidelity prototypes where video is a core part of the experience. This is ideal for demonstrating user flows for video players, showing in-app video ads, creating animated backgrounds, or mocking up social media feeds with video previews. It makes the prototype feel more real to users and stakeholders.

WHEN NOT TO USE IT Avoid using video if your prototype needs to be tested on the Figma mobile app, as playback is not supported there. It's also not a replacement for a full video editing tool; controls are basic. Finally, since adding new videos requires a paid plan, it's not a feature available to collaborators on the Free/Starter tier, which can cause workflow friction.

ONE CANONICAL EXAMPLE A designer is creating a prototype for a music streaming app that features short video loops on artist pages. They create a rectangle shape where the artist header image would go. Instead of an image fill, they select a video fill and upload a short .mp4 loop. In the prototype settings for that video, they enable "Autoplay" and "Loop" so that when a user navigates to that screen, the video starts playing automatically, creating a dynamic and engaging experience.