Tutorial 7 steps 10 min read

How to Generate AI Images in Figma

A step-by-step guide to generating AI images directly on your Figma canvas. You'll learn how to install VM Studio, pick the right model, write effective prompts, and use text-to-image and image-to-image workflows without leaving Figma.

Step-by-Step Guide

Follow these steps to go from zero to generating AI images on your canvas.

1

Install VM Studio

VM Studio is a free Figma plugin. You can install it in two ways:

  1. From Figma: Open any Figma file, right-click the canvas, go to Plugins > Search plugins, and type "VM Studio". Click the result and hit Install.
  2. From the web: Visit the VM Studio plugin page on Figma Community and click Install. Next time you open Figma, it will be available.

Once installed, open the plugin from Plugins > VM Studio in the right-click menu, or pin it to your toolbar for quick access.

Tip

Pin VM Studio to your Figma toolbar so you can launch it with a single click. Right-click the plugin name in the Plugins menu and select "Pin to toolbar".

2

Get your API key

VM Studio connects to AI providers through their APIs. You'll need an API key from at least one provider. Each has different models, pricing, and strengths.

After signing up and creating a key, open VM Studio in Figma, click the settings icon (gear), and paste your key into the field for the provider you chose. VM Studio stores your key locally in Figma — it never leaves your machine except to authenticate with the provider's API.

Recommendation

Start with fal.ai. It gives you access to the most models (FLUX.2, Seedream, GPT-Image, and more) with straightforward per-image pricing starting at $0.005.

3

Choose your model

Open the model dropdown at the top of the VM Studio panel. The model you pick determines image quality, speed, and cost. Here's a quick overview:

  • FLUX.2 Turbo — Fast (~2.6s), cheap ($0.008), good for quick drafts and iteration
  • FLUX.2 Klein 9B — Very fast (~1.5s), cheap ($0.011), strong quality for the speed
  • GPT-Image 1.5 — Highest quality, handles text in images well, slower (~40s), higher cost
  • Seedream v4.5 — Excellent photorealism (~16s), good for product shots and portraits
  • Nano Banana Pro — High quality (~19s), strong at creative and artistic styles
  • Z-Image Turbo — Fastest (~1.5s) and cheapest ($0.005), useful for rough concepts

Not sure which model is right for your use case? Check our model comparisons with side-by-side outputs from identical prompts.

4

Write your prompt

The prompt is the text description that tells the AI what to generate. Better prompts produce better images. Here are practical guidelines:

  • Be specific — Instead of "a dog", try "a golden retriever sitting in a sunlit meadow, soft bokeh background, natural lighting"
  • Mention the style — Add terms like "photograph", "3D render", "watercolor illustration", "flat vector", or "cinematic" to steer the aesthetic
  • Describe the composition — Use "close-up portrait", "wide shot", "top-down view", "centered" to control framing
  • Include lighting — "soft diffused light", "harsh directional light", "golden hour", "studio lighting" all make a difference
UI placeholder photo
Professional headshot of a woman in her 30s, neutral gray background, soft studio lighting, shoulders up, slight smile, corporate style
Product mockup
Minimalist white sneaker on a light concrete surface, soft shadow, clean product photography, high detail, slight angle
Hero illustration
Abstract flowing gradient shapes in blue and purple, dark background, modern tech aesthetic, clean geometric forms
Blog thumbnail
Cozy coffee shop interior, warm lighting, shallow depth of field, morning light through windows, photorealistic
Tip

Use and arrow keys in the prompt field to cycle through your prompt history. This makes it easy to re-run or tweak previous prompts.

5

Generate and place your image

With your prompt written, press ⌘ Enter (Mac) or Ctrl Enter (Windows) to start generation. You can also click the Generate button.

While the image generates, you'll see a progress indicator. Generation takes anywhere from 1.5 seconds (FLUX.2 Klein, Z-Image Turbo) to about 40 seconds (GPT-Image), depending on the model.

Once complete, the image is automatically placed on your canvas:

  • If you have something selected — The image appears to the right of your selection, maintaining alignment
  • If nothing is selected — The image appears at the center of your current viewport

The generated image is a standard Figma rectangle fill, so you can resize it, add effects, mask it, or use it in components just like any other image.

6

Refine with image-to-image

Image-to-image lets you use an existing image as a starting point and describe changes. This is useful for:

  • Changing the background of a product photo
  • Altering the color scheme or mood of an image
  • Adding or removing elements from a scene
  • Converting a rough sketch into a polished render

To use it:

  1. Select a frame or image on your canvas
  2. Open VM Studio — it will detect your selection automatically
  3. Write a prompt describing what you want changed (e.g., "change background to a sunset beach scene")
  4. Press ⌘ Enter to generate

The result appears as a new image next to your original, so you never lose your source image.

Note

Not all models support image-to-image. Check for the "i2i" badge in the model dropdown, or see the model comparisons page for a full feature breakdown.

7

Generate batch variations

When you need multiple options to choose from, increase the image count before generating. VM Studio will produce several images from the same prompt, each with different outputs.

The images are placed in a grid layout with smart positioning. VM Studio uses a diagonal expansion algorithm to find non-overlapping positions, so your existing canvas content stays untouched. If you generate again within 30 seconds, subsequent images continue in the same grid.

This is particularly useful for:

  • Exploring different visual directions for a hero image
  • Generating a set of avatar placeholders
  • Creating multiple thumbnail options for A/B testing
  • Quickly filling a moodboard with variations

Pro Tips

Shortcuts and techniques to get the most out of VM Studio.

Prompt History

Press and in the prompt field to scroll through previous prompts. Your history persists across sessions, so you can pick up where you left off.

Aspect Ratios

Use the aspect ratio selector to match your design needs. Square (1:1) works for avatars and thumbnails. Landscape (4:3 or 16:9) for hero sections. Portrait (3:4) for mobile screens and cards.

Resolution Options

Some models offer 1K, 2K, and 4K resolution options. Use 1K for fast iteration and placeholders. Switch to higher resolutions when you need the final asset.

Selection-Aware Placement

Select a frame before generating to place images relative to it. This is useful for filling specific layout slots or building out a design systematically.

Switch Models Quickly

Start with a fast model like FLUX.2 Klein to explore ideas, then switch to GPT-Image or Seedream for the final polished version of your best prompt.

Multiple Providers

You can add API keys for all four providers and switch between them. Each provider has unique models, so having multiple keys gives you the widest selection.

Frequently Asked Questions

Is VM Studio free to use?

The VM Studio plugin itself is free. You only pay for the API usage from your chosen provider. Most providers offer free tiers or credits for new accounts, so you can try it without spending anything.

Which AI model should I choose for Figma?

It depends on your needs. FLUX.2 Klein and FLUX.2 Turbo are fast and cheap, great for rapid iteration. GPT-Image 1.5 produces the highest quality but is slower. Seedream v4.5 excels at photorealism. Check our model comparisons for detailed benchmarks.

Can I use AI-generated images in commercial Figma projects?

Yes. Images generated through these AI models are generally available for commercial use. Check your specific provider's terms of service for details on usage rights and attribution requirements.

Do I need to leave Figma to generate AI images?

No. VM Studio runs entirely inside Figma as a plugin. You write prompts, generate images, and place them on your canvas without switching to another application or browser tab.

What image sizes does VM Studio support?

VM Studio supports multiple aspect ratios and resolutions depending on the model. Common options include 1024x1024 (square), 1024x768 (landscape), and 768x1024 (portrait). Some models support up to 4K resolution.

Start generating AI images in Figma

Install VM Studio and go from prompt to placed image in seconds.

Add to Figma