Connect your design library
Point the agent to your design system so every hero it generates uses your real components, tokens, and styles—not generic elements you'll replace later.
Generate hero images right on your canvas
Create compelling landing page visuals with AI—directly in Figma Design. The agent references your design system, so every hero you generate fits your brand. No separate tools, no rebuilding.
Explore more directions, faster
Generate hero images that match your brand system and see them in context on your canvas—where your team already works.
Explore in higher fidelity, faster
Figma's agent generates hero images using your actual design library—real components, colors, and typography. You get polished options that fit your brand, not generic placeholders you'll need to rebuild from scratch.
Cut the busywork, stay in flow
Skip the cycle of mocking up hero concepts by hand, one at a time. Describe what you need, run parallel prompts, and see multiple directions on your canvas at once—so you can focus on choosing, not constructing.
Keep your team aligned from the start
Every hero you generate lives in the same file your team works in. Stakeholders see the full prompt history and context behind each option, so feedback happens faster and nothing gets lost in handoff.
The features behind the generation
A closer look at what sets Figma's agent apart, built for the way design teams actually work.
Parallel prompting
Run multiple prompts at once to explore different hero directions simultaneously. Compare options side by side on your canvas without waiting.
Shareable threads
Share a thread and your team sees the full prompt, context, and iteration history behind any hero concept. No separate handoff needed.
Refine with follow-ups
Not quite right? Adjust with another prompt in the same thread, or open a parallel one to try a different direction without losing your progress.
Figma feels like a natural extension of my hand. I do my design ideation on the canvas, and now the agent takes it the last mile. With my design libraries connected, I can move from design to code faster than ever before.
Andy Madrick
Product Designer, Notion
Get started with Figma's agent
Open the agent
Select "Agents" in the left side rail or hit CMD + Enter. Add a frame to your canvas to work in.
Describe your hero
Tell the agent what you need—the mood, the message, the layout. Point it to your design library so it uses your real components and styles.
Review on canvas
Check the generated hero in context. Refine in the same thread or start a parallel one to explore a completely different direction.
Keep iterating
Everything stays editable on your canvas. Prompt again, adjust by hand, or turn your workflow into a reusable skill for future heroes.
Become an agent expert
The Figma design agent is here
Read moreWatch Figma's AI Agent in action and see how to put it to work in your own workflows.
Work with the Figma agent
Get startedHands-on playground to explore Figma agent's capabilities — from bulk edits to feedback implementation — with step-by-step guidance built right in.
How to use Figma agent in your design workflows
Watch nowLearn how to use Figma agent in your design workflows with a step-by-step tutorial from the Figma team.
FAQ
A hero image generator uses AI to create the large, prominent visuals that anchor landing pages and website headers. Figma's agent generates these directly on your design canvas, using your connected design library so the output matches your brand system from the start. You describe what you need and see options appear in context.
In Figma Design, open the agent from the left side rail and describe the hero you want—the layout, mood, and key elements. Point the agent to your design library so it references your real components and styles. Review the output on your canvas and refine with follow-up prompts until it's right.
Hero image dimensions vary by use case, but common sizes include 1920×1080 pixels for full-width desktop headers. Figma's agent generates heroes directly on your canvas, so you can set your frame to any dimension and the output will fit your layout. You stay in control of sizing and can adjust as needed.
A strong hero image communicates your value proposition instantly, uses visuals that reinforce your brand, and draws the eye toward your primary call to action. With Figma's agent, you can explore multiple hero directions quickly—testing different layouts, imagery, and compositions to find what works best for your audience.
Figma's agent is available on all paid Figma plans. You'll find it in the left side rail in Figma Design. During the current open beta, it doesn't consume AI credits—so it's a good time to explore, experiment, and share your feedback with us.
Build faster with Figma's agent